jquery - jQuery 验证与 Ajax 表单提交冲突

Question

可能重复：
jQuery 验证：一些必填字段未填写但仍可以提交表单

我使用 jquery 验证（http://bassistance.de/jquery-plugins/jquery-plugin-validation/）进行表单验证：

HTML：

<form id="formID" action="/processForm" method="post">
  ...
  <input type="submit" value="Submit" />
</form>

jQuery：

$("#formID").validate({
  onkeyup:false,
  rules: {
    ...
  },
  messages: {
    ...
  }
});


// Submit the form by Ajax
$(document).ready(function() {
  $('.formID').ajaxForm({
    success: function(returnData) {
      $('#content').html(returnData);
    }
  });
});

现在表单似乎是由 validate() 函数提交的，而不是由 Ajax 函数提交的。

我如何仍然使用 Ajax 功能？

Answer 1

现在表单似乎是由validate()函数提交的，而不是由 Ajax 函数提交的。我如何仍然使用 Ajax 功能？

那是因为validate()插件已经submitHandler:内置了。以下是如何正确使用它并避免作用于同一submit事件的多个函数之间的潜在冲突。

$(document).ready(function() {

    $("#formID").validate({
      onkeyup:false,
      rules: {
        ...
      },
      messages: {
        ...
      },
      submitHandler: function(form) {
          form.ajaxForm({
              success: function(returnData) {
                  $('#content').html(returnData);
              }
          });
      }
    });

});

Answer 2

试试这个JS：

$('#formID').on('submit',function(){

// call your function which send AJAX  reuest
// Or code of sending ajax reauest

return false;

})