3

I have a JQuery UI submit button on a form when it's clicked to both prevent double-clicking and to also make it visibly clear that it was in fact clicked properly.

So I use jQuery to do this:

$('input:submit').click(function() {
    $(this).button('disable');
});

It works, but the problem is when the user hits their back button it remains disabled. What's the proper way to disable a submit button when clicked? I obviously use jQuery, so preference is to use jQuery.

UPDATE: many people suggested I use $(document).ready(function() {$('input:submit').button('enable');}); to overcome this persistent disabling of the button. It turns out that won't work if it comes before my button initialization call in $(function() {}. But if I put that button('enable') after my button initialization code, even in the $(function() {}) section, then it works as expected.

But now I realize this whole button disabling only works in Firefox! If I disable the button, the form won't submit in IE and Chrome (haven't tested others)!

UPDATE 2: I finally got this to work, though a bit concerned some browsers are not going to be able to submit things with these workarounds... Here's my final code, would love to hear opinions of potential issues:

$(function() {
    $('input:submit').button().click(function() {
        $(this).button('disable');
        $(this).closest('form').submit();
        return false;
    });
    $('input:submit').button('enable');
});
4

5 回答 5

2 
$(document).ready(function(){
 $("input:submit").attr("disabled", "");
})
于 2010-12-09T20:03:30.910 回答
0

正如其他人所提到的，当您单击后退按钮时，表单会保留（部分）其状态，因此您需要在页面加载时启用提交按钮（当有人单击后退按钮时也会发生这种情况）。

将此添加到您的页面：

$(document).ready(function(){
  $("input:submit").button("enable");
});

请注意，此解决方案使用与您使用的方法相反的jQuery UI 方法。button.enable()button.disable()

于 2010-12-09T20:12:49.153 回答
0

将此添加到页面。

$(document).ready(function() {
  $('input:submit').button({ disabled: false});
});
于 2010-12-09T20:02:15.747 回答
0

好吧，它一直处于禁用状态，因为浏览器最好将表单状态保存在历史记录中。所以我只建议附加到 load 事件并删除 disabled 属性。

于 2010-12-09T20:03:40.900 回答
0

button我在 jQuery API 文档中找不到对该方法的任何引用。你在使用某种模块吗？

回击应该将表单重置为初始状态，所以我想该button方法一定会发生一些会话魔法。请尝试以下操作：

$('input:submit').click(function() {
    $(this).attr('disabled', 'disabled');
});
于 2010-12-09T20:04:41.430 回答