如何在标准表单提交时出现valiadtion错误时阻止表单提交？

我正在开发一个表单，其中包含一些文本字段和一些文件上传字段。 一些javascript代码通过将其添加到div元素（id = wrapper）来动态地构建表单。 对于我的knowlegde，无法通过ajax发送/上传文件，因此我选择“经典方式”发布表单，请参阅下面的代码。 但是，我希望通过jqueryvalidationvalidation文本字段; validation代码工作正常，但如果在validation错误的情况下如何防止表单提交？ 我假设我需要以某种方式覆盖标准表单提交处理程序，但不知道如何做到这一点……

//original form submit code $("#formNewAgreements").submit(function(){ var form = $("#formNewAgreements"); form.validate(); if(form.valid()){ //only submit via ajax if javascript validation has been performed successfully $.ajax({ type: "POST", url: "suppladmin_agreementsetup_submit_x1.php", data: $("#formNewAgreements").serialize(), dataType: "json", success: function(msg){ if(msg.statusgeneral == 'success'){ $("#wrapper").children().remove(); //remove current New Agreements form SetupAgreements(); } else { $("#errorbox").html(msg.statusgeneral); }//else }, //succes: function error: function(){ $("#errorbox").html("There was an error submitting the form. Please try again."); } });//.ajax //make sure the form doesn't post return false; } //if(form.valid() });//$("#myForm").submit() //validation code for validing the textfields var completeform = $("#formNewAgreements"); completeform.validate(); //html code form 
 <!----> Add agreement 
  <input type="hidden" name="form_token" value="" />  
  

Answer 1

引用OP：

“我希望通过jqueryvalidation文本字段validation”

由于您使用的是jQuery Validate插件，因此只需为您的ajax实现submitHandler回调即可。 根据文档 ，这是“经过validation后通过Ajax提交表单的正确位置” 。

尽管别人的答案，

• 您不需要内联JavaScript。

• 您不需要任何其他事件处理程序。

 var completeform = $("#formNewAgreements"); completeform.validate({ submitHandler: function(form) { // your ajax here return false; // block default form action } }); 

演示： http ： //jsfiddle.net/U4P3F/

Answer 2

试试这个

在这种情况下，您的validate方法应该返回true或false，具体取决于表单是否有效。

编辑：正如@ lex82所提到的，正确的方法是添加处理程序以进行表单提交。 将表单标记更改为：