jquery.form / validate插件仅允许在输入更改时提交

我想使用jQuery.Form / Validate插件，只允许在任何输入实际更改时提交我的表单。

使用beforeSubmit: :: http：//jquery.malsup.com/form/#options-object有回调逻辑。 但是，我似乎无法使其发挥作用。

这是我到目前为止所拥有的：

 $(document.body).on('click', 'input[type="submit"]', function(){ var $form =$('form'); $form.validate({ submitHandler: function($form) { $($form).ajaxSubmit({ beforeSubmit: function(arr, $form){ var value = '', storedValue=''; $($form+':input').each(function (index, el) { value=$(el).val(); storedValue=$(el).data("stored"); if(value!=storedValue){ console.log("Changed"); return true; } else { return false; console.log("NOT changed"); } }); ...success handling, etc.. beforeSubmit: function(arr, $form) { var value = '', storedValue=''; $($form+':input').each(function (index, this) { value=this.value; storedValue=$(this).data("stored"); if(value!=storedValue){ console.log("Changed");return true; } else { return false; console.log("NOT changed"); } }); } 

这是HTML：

 
  my description   

目前，console.log显示"Changed" ，无论storedValue是否与输入相等。

Answer 1

首先，它永远不会显示“未更改”，因为它在击中该部分之前returns false 。 您应该过滤掉提交按钮，因为您可能没有检查其值。

 $($form+':input').not(':submit').each(function(index, this) { value = this.value; storedValue = $(this).data("stored"); if (value != storedValue) { console.log("Changed"); return true; } else { console.log("NOT changed"); return false; } }); 

更新在@wirey的大力帮助下，我们（@timrpeterson和@wirey）共同制定了一个解决方案。 我不是在each()循环中返回true / false，而是在each()循环之后递增一个值totalChanged并进行评估，无论它是否大于0。

这是代码：

 beforeSubmit: function(arr, $form){ var value = '', storedValue='', totalChanged=0; $('#myForm :input').not(':submit,:hidden').each(function (i, el) { //console.log($(this)); console.log($($form)); value=$(el).val(); storedValue=$(el).data("stored"); if (value != storedValue) { totalChanged++; } else { } }); //each if(totalChanged>0){ console.log("at least one changed"); return true; } else{ console.log("All NOT changed"); return false; } } //beforeSubmit