禁用提交按钮会停止 chrome/IE8 中的请求

Question

我有一个包含三四个输入字段和一个提交按钮的简单表单。

要实现的功能：点击提交按钮时，提交按钮应该被禁用，这样就不能再点击其他按钮了。我无法隐藏按钮。

现在我正在使用 jquery/javascript 禁用提交按钮，请求也被禁用并且表单没有在 CHROME/IE8 中发布。

有什么解决办法？？？

编辑：

代码：

$('#submit').attr('disabled', true); OR $('#submit').prop('disabled', true);// for IE

我什至尝试过$('#submit').attr('disabled', 'disabled');，但结果相同。

Answer 1

你说你不能隐藏按钮，但这就是你需要的答案。

当我遇到这个问题时，我隐藏了按钮并用相同大小的小型“加载”微调器图形替换它。

这涉及向用户提供对所发生事件的合理反馈的问题，以及解决禁用按钮问题。

如果您确实需要按钮保持在原位但被禁用，那么您可以使用相同的技术隐藏实际按钮并在其位置显示一个看起来相同但被禁用的替代按钮。

顺便说一句，当我遇到这个问题时，并不是表单根本无法发布；只是浏览器没有在它发布的字段中包含禁用按钮。如果您的后端脚本依赖于作为发布值之一的按钮，这显然是一个问题。如果这是它发生的方式，那么另一个解决方案是有一个隐藏字段，并在禁用按钮时将按钮值复制到其中。这仍然会提交表单，而不会发布禁用按钮，但您需要的值将出现在隐藏字段中。

希望对您有所帮助。

Answer 2

点击事件 - 提交表单。

$(document).ready(function(){
    $('#submit-button-id').click(function(e) {
        //stop normal submit
        e.preventDefault();

        //disable button
        $(this).attr('disabled','disabled');

        //submit form
        $('#form-id').submit();
    });
});

这也有效。

$(document).ready(function(){
    $('#form-id').submit(function(e) {
        e.preventDefault();
        somefunction();
    });
});

function somefunction() {
    $('#form-id').unbind('submit');
    $('#submit-button-id').attr('disabled','disabled');
    $('#form-id').submit();
}