3

SO 这里有几个线程，但我没有找到专门处理我在我的应用程序中广泛使用的很棒的jQuery Form 插件的线程。

我希望用户只能单击“提交”一次——并禁用“提交”按钮，直到 Ajax 成功返回 JSON 字符串。

我的试用代码是这样的

$('#submit_button').live('click', function(e) {
e.preventDefault();

var options = {
    type:           'post',
    dataType:       'json',
    beforeSubmit:   function(){
                        $('#loading').show().fadeIn();
                        $('#submit_button').attr('disabled', 'disabled');
                    },
    success:        function(data) {
                            if (data.success === 3) {
                                $('#submit_button').hide();
                                $('#loading').hide();
                                $('#validation_message').html(data.message).fadeIn();
                                $('#submit_button').attr('enabled', 'enabled');
                            }
                    }
            }

$(this).closest('form').ajaxSubmit(options);
});

但这会在<button>.

<button class="button" id="submit_button" disabled="disabled" enabled="enabled"> Post </button>

你对如何让它发挥作用有什么建议吗？

4

3 回答 3

2

而不是将属性“启用”设置为“启用”，您需要取消设置“禁用”属性：$('#submit_button').attr('disabled', '');

HTML 没有按钮的“启用”属性，因此浏览器不会对它做任何事情 - 它认为它只是一个“垃圾”属性。设置和取消设置“禁用”属性是您所追求的。

于 2012-06-20T02:24:52.823 回答
1

尝试：

在成功处理程序中添加此行..

 $('#submit_button').removeAttr('disabled');

在成功处理程序中删除此行：

$('#submit_button').attr('enabled', 'enabled');
于 2012-06-20T02:25:17.590 回答
1

现在无法对其进行测试，但使用removeAttr应该会有所帮助（在 beforeSubmit 部分中启用了删除，反之则成功）。

于 2012-06-20T02:25:36.177 回答