jQuery撤消click（）函数的更改

我想对表单输入文本字段上的css和class进行一些更改，当用户单击答复按钮并且我已经工作了，但底部的表单仍然保留这些更改。所以我的问题：有什么办法可以撤销这些更改并将窗体返回到以前的状态？jQuery撤消click（）函数的更改

$(".comment-reply-link").click(function() { 
    if($("#commentform").width() < 590){ 
     $("#commentform input[type='text']").css("margin-left","0"); 
     $("#commentform input[type='text']").removeAttr('class'); 
    } 
})

来源

2013-11-23 Jeton R.

在任何需要的事件下，您都可以使用相同的代码将值重置回其先前的值。 –

按下“回复”按钮后，可以使用setTimeout（）自动恢复。 –

AFAIK，没有方法可用于存储DOM中发生的更改并在需要时恢复。你可以做到这一点像下面

$('.element').bind('click', plus10); 
$('.revertChange').bind('click', minus10); 
var input = $('#someInput'); 

function plus10(){ 
     input.val(input.val() * 1 + 10); 
} 
function minus10(){ 
     input.val(input.val() * 1 - 10); 
}

如果你想与必要的样式添加样式和恢复使一个类，然后切换类

.someClass{ 
     margin:10px; 
     color:green; 
     /* ...... */ 
}

然后切换类元素像下面

$('element').toggleClass("someClass");

来源

2013-11-23 15:51:12 redV

如果你的意思是撤消联样式，以及是你可以：

$("#commentform input[type='text']").css("margin-left","");

这将例如复位/撤消margin-left您的内嵌样式。

来源

2013-11-23 15:39:25 nkmol

是的，但如何触发该事件，我必须为例如另一个点击功能。当他们点击提交或取消按钮来做这些更改？ –

@JetonRamadani那么，你想什么时候重置它？目前还不清楚“底部形式”的含义。提供给我一个[jsFiddle]（http://jsfiddle.net/），以便我可以看到你的问题。 – nkmol

对不起，每条评论旁边都有一个回复按钮，点击后表格出现，我做了这些改变。现在表单可以选择取消或提交评论。所以我可以在这些按钮上做另一次点击（）来重置这些更改@nkmol –

这是一种用jquery的数据存储克隆状态并随时恢复的方法。无论您对元素所做的更改次数如何。例如，

http://jsfiddle.net/xr63r/

HTML

<div id="commentform"> 
    <input type="text" class="red-border" /> 
    <button class="comment-reply-link">test</button> 
</div> 
<button class="undo">undo</button>

$(".comment-reply-link").click(function() { 
    if($("#commentform").width() < 590){ 
     /*create a clone of the element you modify*/ 
     var theClone = $("#commentform").clone(true,true); 
     /*add the cloned element to a data attribute for restoring the state*/ 
     $("#commentform").data("undo",theClone); 

     /*any kind of css modifications may follow*/ 
     $("#commentform input[type='text']").css("margin-left","0"); 
     $("#commentform input[type='text']").removeAttr('class'); 
    } 
}) 

$(".undo").click(function(){ 
/*if state undo exists, restore it*/ 
    if($("#commentform").data("undo")){ 
     var theClone = $("#commentform").data("undo"); 
     $("#commentform").replaceWith(theClone); 
    } 
});

CSS

/*this is an example css style related to a class*/ 
input.red-border{ 
    border:red 1px solid; 
}

来源

2013-11-23 15:53:34 melc

jQuery撤消click（）函数的更改

回答

相关问题