如何禁用页面上的所有按钮和链接，但仍允许回发？

Question

我试图阻止用户单击页面上多个导致回发的元素。换句话说，如果他们单击“继续”提交按钮，他们不应该能够在原始请求返回之前导致另一次回发。

我尝试过两个版本的 jQuery 代码。两者都不完全符合我的要求：

此版本将禁用所有回发元素，但这样做会阻止单击的元素触发。根据记录，我不认为 .removeAttr('onclick') 确实是必需的，但将其排除似乎并没有改变行为。

$(function() {
    $('a, :button, :submit').click(function() {
        var elements = $('a, :button, :submit');
        elements.attr('disabled', 'disabled').removeAttr('onclick');
    });
});

此版本禁用所有其他回发元素，但它允许我重用被单击的同一元素 - 我不希望能够两次点击同一按钮。

$(function() {
    $('a, :button, :submit').click(function() {
        var otherelements = $('a:not(#' + $(this).attr('id') + '), :button:not(#' + $(this).attr('id') + '), :submit:not(#' + $(this).attr('id') + ')');
        elements.attr('disabled', 'disabled').removeAttr('onclick');
    });
});

我怎样才能防止这种行为？

Answer 1

我刚刚在没有 JQuery 的情况下测试了你的第一种方法，它工作得很好，即禁用提交按钮并没有阻止表单提交。

<form method="get">
  <input type="text" name="textfield" value="a" />
  <input type="submit" onclick="this.disabled=true">
</form>

也许您想仔细检查是否还有其他情况，例如 JQuery，正在发生？

Answer 2

也许您可以放置​​一个标志或其他东西，让它记住单击了哪个按钮，如果该标志存在，您可以删除该回发元素上的 onclick 事件。但我认为这不能单独在客户端脚本中完成，因为一旦提交页面，所有客户端元素和脚本都会刷新。

Answer 3

也许不要将其设置为单击函数，而是将其设置为 onmouseup，以便它在单击事件发生后触发。

Answer 4

这是一个有效的最终版本 - 只是覆盖表单提交事件而不是查看任何单独的元素。

var submitted = false;
$(function() {
    $('form').bind('submit', function() {
        if (!submitted) {
            submitted = true;
            return true;
        } else {
            return false;
        }
    });
});

感谢大家的建议。