0

我使用此代码（来自 SO）禁用 asp.net Web 表单按钮以在单击时禁用按钮

$(document).ready(function () {
    $('[id$=btnSave]').click(function () {
        var button = this;

        setTimeout(function () {
            $(button).attr('disabled', 'disabled');
        }, 100);
    });
});

但是当我将WebForms 插件的jQuery 验证和JQuery 验证组添加到页面时，

$(document).ready(function () {
    $("#form1").validateWebForm({
        rules: {
            myDate: {
                customDate: true
            },
            nic: {
                nicNo: true
            }
        }
    });
...
<asp:TextBox ID="txtName" runat="server" CssClass="required" ></asp:TextBox>

即使输入无效，它也会禁用按钮。如果输入无效，如何避免禁用按钮？

4

1 回答 1

1

在禁用按钮并提交之前尝试使用插件的内置.valid()方法来测试表单。根据评论，我意识到您正在使用另一个插件初始化 jQuery Validate 插件，但下面的核心概念应该是相同的。

演示：http: //jsfiddle.net/7HzZF/

jQuery :

$(document).ready(function() {

    $('#myform').validate({
        // rules & options
    });

    $('#button').on('click', function (e) {
        e.preventDefault();
        if ($('#myform').valid()) {
            $('#myform').submit();
            $(this).attr('disabled', 'disabled');
        }
    });

});

HTML：

<form id="myform">
    ....
    <input id="button" type="submit" />
</form>

或者，如果您的其他插件允许您使用submitHandler回调函数，我强烈建议您改用它。

http://jsfiddle.net/h34bJ/

它只在有效表单上触发，它真正清除了许多这种多余和多余的事件处理。

$(document).ready(function () {

    $('#myform').validateWebForm({
        // your rules,
        submitHandler: function (form) {
            $('#button').attr('disabled', 'disabled');
        }
    });

});
于 2013-03-21T04:43:47.903 回答