如何在提交表单时没有任何错误地禁用提交按钮

Question

我想在用户提交表单时禁用提交按钮,这样他就不会再单击提交按钮两次.

所以我在我的页面中编写了以下javascript

$(document).ready(function(){
    $("form").submit(function(){
       $("form").find('input[type=submit]').attr('disabled', 'disabled');
    });
})

这非常有效.但是当我应用jquery验证库并附加以下代码时

$(document).ready(function(){
    $("form").submit(function(){
       $("form").find('input[type=submit]').attr('disabled', 'disabled');
    });

    $("form").validate({
            errorClass: "jqueryError",
            errorElement: 'label',
            success: 'jqueryValid',
            messages: {
                TopicCategory: {
                    required: 'Please choose a category for topic.'
                },
                TopicSubcategoryId: {
                    required: 'Please choose a subcategory for topic.'
                },
                TopicTitle: {
                    required: 'Please enter a title for topic.'
                }
            }
        });
})

提交表单后提交按钮被禁用,即使网站中存在不完整的输入(即表单有错误,要求用户正确填写).
当用户完成表格更正所有错误时,提交按钮被禁用.

如何首先检查表单中是否有错误,然后禁用提交按钮,最后提交.

谢谢

Answer 1

将以下参数添加到jQuery Validate:

submitHandler: function(form) {
    $(':submit', form).attr('disabled', 'disabled');
    form.submit();
}