Question

我这样做：

...submit(function() {
    $.post(...,function() {
         validate();
    })
});

但事实证明表格是直接提交的......

Answer 1

查看jQuery Validation Plugin。

以下是如何使用它的示例：

$("#myForm").validate({
    rules: {
        command: 'required'
    },

    messages: {
        command: 'Please enter a command.'
    },

    submitHandler: function(form) {
        $(form).ajaxSubmit({
            success: function(data) { /* ... */ },
            url: form.action,
            dataType: 'json'
        });
    }
});

Answer 2

您必须抓住每个元素并通过验证运行它，然后再提交表单。

使用$(id).value（对于id-d元素）或yourForm.someElementName.value（对于name-d元素，假设您的表单为name d yourForm）。

Answer 3

您需要阻止默认表单提交

http://api.jquery.com/event.preventDefault/

$("form").submit(function(event){
  event.preventDefault();
  if(valid())
  {
    $.post . . .
  }
});

Answer 4

如果你想要AJAXily进行服务器端验证而不将表单发布到另一个页面，你可以做这样的事情。您可以将“提交”按钮设置为“按钮”类型，然后将验证绑定到其点击事件，而不是将验证操作绑定到提交。一旦通过验证，您就可以继续。

例如：

$('#myPseudoSubmitButton').click(function() {  
     // Send the form to the server side for validation  
     $.post('validation_script.php', { form inputs here }, function(data) {  
          if (data.validated) {
               // Perform some functionality that happens when the form validates
          }
          else {
               // Display an error message to the user
          }
     });
}, 'json');

这当然预先假定您的验证脚本返回带有“validated”属性的JSON格式数据。

如何在jQuery中提交之前通过ajax验证表单？

4 个答案: