为什么在我添加jquery验证插件后，我的表单开始需要双击才能提交?我该如何更改它

Question

我的表单提交按钮附带了一个submit（）事件，在我开始使用jquery验证插件之前，我可以一键提交此表单。现在由于某种原因，它需要第二次点击。如何使其返回到单击？

$("form").submit(function(){
    $(".selector").validate({

          rules: {
                   performance : {
                           required: true
                           //customvalidation: true
                   },
                   location : {
                           required: true
                           //customvalidation: true
                   },
                   date : {
                           required: true
                           //customvalidation: true
                   }
           },
           messages: {
                   performance : {
                           required: "enter a show name"
                           //customvalidation: true
                   },
                   location : {
                           required: "enter a location"
                           //customvalidation: true
                   },
                   date : {
                           required: "pick a date"
                           //customvalidation: true
                   }
           }
return false;
}); //closes submit()        

});

Answer 1

这就是你的全部问题。。。

$("form").submit(function(){
    $(".selector").validate({
        ...

您不需要将.validate()放入submit事件处理程序中。插件已自动捕获submit事件。.validate()方法是表单上插件的初始化方法；它只附加到form元素，然后只在DOM ready上调用一次。（你现在需要双击，因为第一次点击只是为了初始化插件。）

就这样吧。。。

$(document).ready(function() {
    ("#yourform").validate({
        // options & rules
    });
});

简单演示：http://jsfiddle.net/x6Ckg/

无论出于何种原因，如果您需要在submit事件上运行其他代码，则可以使用插件提供的submitHandler回调函数。

$(document).ready(function() {
    ("#yourform").validate({
        //options & rules,
        submitHandler: function (form) {
            // stuff to do when form is valid
            // ajax, etc?
        }
    });
});