Question

我有一个带有文本区域的表单。有些人双击提交按钮，即使我在提交后提出“请稍候”的消息，有些人仍然设法进行双重提交。

文本区域的问题是我不能在数据库中使该列唯一，所以我的问题是 - 如何确保这些表单不会被提交到数据库两次。

即使他们有时进入数据库，我该如何阻止他们显示？也许阶梯是更好的选择？

谢谢！

Answer 1

使用包含唯一标识符的隐藏字段。

即使他们有时进入数据库

如果您将唯一标识符存储在数据库中并添加＆＃34; UNIQUE INDEX＆＃34;到那一列，他们首先不会进入数据库。

Answer 2

首次点击后禁用提交按钮。

例如，如果你使用的是jQuery，你可以这样：

$('input[type=submit]').click(function() {
  $(this).attr('disabled', true);
});

Answer 3

对于使用jQuery的UI解决方案，请使用类似

的内容

$("#foo").one("click", function() {
  console.log("This will be displayed only once.");
});

请参阅.one()

这样可以尽快解决双重提交问题。如果您依赖后端的唯一提交，请将唯一标识符作为隐藏字段。

Answer 4

您可以使用一些JavaScript ......

var submitted = false;
document.querySelector('form').addEventListener('submit', function(event) {
    if (submitted) {
        event.preventDefault();
    }
    submitted = true;
    this.querySelector('input[type="submit"]').disabled = true;

}, false);

jsFiddle

（当然，请检查这些方法的兼容性。）

如果您碰巧使用jQuery ......

var submitted = false;
$('form').submit(function(event) {
    if (submitted) {
        event.preventDefault();
    }

    submitted = true;
    $(this).find(':submit').prop('disabled', true);

});

jsFiddle

防止双重表单提交文本区域的最佳方法

4 个答案: