使用jquery监视表单字段更改

尝试学习一些jquery来实现自动保存function，需要一些帮助。 我有一些代码来监视表单字段的状态，以查看是否有任何更改。 一切正常，但我只需要监控特定表单中的更改，而不是页面上的所有表单输入。 在同一页面上有一个搜索框和一个新闻稿表单，当这些表单字段发生变化时，它们也会被检测到，我需要以某种方式或更好的方式过滤掉，只针对特定的表单。

$(function(){ setInterval("CheckDirty()",10000); $(':input').each(function() { $(this).data('formValues', $(this).val()); }); }); function CheckDirty() { var isDirty = false; $(':input').each(function () { if($(this).data('formValues') != $(this).val()) { isDirty = true; } }); if(isDirty == true){ alert("isDirty=" + isDirty); } } 

Answer 1

只需在表单中添加一个类并使用它进行过滤即可

 $('.form :input').each(function() { $(this).data('formValues', $(this).val()); }); 

编辑

只是一个建议，您可以将更改事件直接附加到表单

现场演示： http ： //jsfiddle.net/jomanlk/kNx8p/1/

 
 
 
 
 
 
 
 $('form :input').change(function(){ $('#log').prepend('
Form changed
') }); 

您可以通过添加计时器并使其每xx秒保存一次来轻松改进。

Answer 2

 var $jq= jQuery.noConflict(); $jq(function() { $jq('#extensibleForm').data('serialize',$jq('#extensibleForm').serialize()); }); function formHasChanged(){ if($jq('#extensibleForm').serialize()!=$jq('#extensibleForm').data('serialize')){ alert("Data Changed...."); return (false); } return true; } 

Answer 3

你的表格是什么ID？

你只需要让你的选择器更具体:)

而不是$(':input').each(function() {

使用

 $('#yourFormId').find(':input').each(function() { 

Answer 4

我想你可以用一个类来选择你想要的输入类型。

然后在jQuery中使用它。

 $(':input .savethis').each(function() { ... 

Answer 5

您可以为表单元素指定id属性（比如theForm ），然后只选择其中的那些输入字段。

然后尝试选择

 $(':input', '#theForm') 

Answer 6

您可以使用.change()函数，然后使用$(this)表示您只想使用正在被更改的字段。

 $('#myForm input[type="text"]').change(function() { $(this)... }); 

编辑：#myForm是您的表单ID，因此您可以定位特定表单。 您甚至可以在该表单中指定type =“text”字段，如我的示例所示。

Answer 7

在这里你可以看到它工作： http ： //jsfiddle.net/paska/zNE2C/

 $(function(){ setInterval(function() { $("#myForm").checkDirty(); },10000); $("#myForm :input").each(function() { $(this).data('formValues', $(this).val()); }); $.fn.checkDirty = function() { var isDirty = false; $(this).find(':input').each(function () { if($(this).data('formValues') != $(this).val()) { isDirty = true; } }); if(isDirty == true){ alert("isDirty=" + isDirty); } }; });