Jquery 验证插件防止验证时重复提交

Question

我正在使用 jquery 验证插件:

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

我想仅在验证通过时禁用提交按钮:

已经尝试

$("#submit").click(function()
{
    $(this).attr("disabled", "disabled");
});

但是即使验证失败，这也会禁用提交按钮。有没有办法仅在验证通过并且发生提交事件时禁用提交？

Answer 1

查看源代码，看起来您应该能够重写invalidHandler，大致如下:

$("#form").validate({
    submitHandler: function(form) {
    // disable your button here
    form.submit();
   },
   invalidHandler: function() {
     // re-enable the button here as validation has failed
   }
});

乍一看，这似乎是您想要使用 validate 插件执行此操作的方式，但不幸的是，我没有时间摆弄它来制作 当然它有效。

编辑:

这应该可以(我使用了一个名为 fname 的文本字段进行测试):

$('#frm').bind('invalid-form.validate', function(){
    // you can add extra validation handling here if you want to
});

$('#frm').validate({
    rules: {
        fname: "required"
    },
    submitHandler: function(form){
        $('form input[type=submit]').attr('disabled', 'disabled');
        form.submit();
    }
});

submitHandler仅在验证通过后才被命中。