jquery - 为什么我添加 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 就绪时调用一次。 (您目前需要双击，因为只需第一次单击即可初始化插件。)

只需这样做...

$(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?
        }
    });

});