javascript - OnClick - 防止用户多次提交

Question

可能重复：
如何防止客户端提交多个表单？

我们有一个正在使用的项目管理工具，但是当用户在任务下提交日志时，他们会多次单击提交按钮。这增加了相同信息的几个条目。

我已经追踪了 PHP 文件中的代码，并且我在网上看到了许多关于提交点击的解决方案。在过去的四五个小时里，我一直在玩耍，但不幸的是，我无法得到任何工作。我希望有人可以提供一点帮助：

这是我在 PHP 文件中的代码：

<input type="submit"  class="button" value="<?php echo $AppUI->_('update task'); ?>" onclick="updateTask();" />

实际上，我只希望用户单击按钮，然后单击一下。它要么是灰色的，要么用户无法再点击。

谢谢

score 5 · Accepted Answer

只需禁用updateTask()功能中的按钮：

document.getElementById("mysubmit").disabled = true;

这假设您将 ID 添加到您的提交按钮。

如果是 AJAX 提交，请确保在提交失败时重新启用按钮。

score 3 · Accepted Answer

为什么不简单地禁用 updateTask() 脚本中的按钮？

document.getElementByID("myButton").disabled='disabled'

如果 updateTask 函数过于通用，那么您的按钮可以调用更具体的函数来处理该按钮：

function myButtonClicked() {
    document.getElementByID("myButton").disabled='disabled';
    updateTask();
}

然后将您的按钮更改为调用 myButtonClicked 而不是 updateTask。

<input type="submit" ... onclick="myButtonClicked();" />

2 回答 2