<button type="submit"> onclick 提交两次？

Posted 2023-02-22

【中文标题】<button type="submit"> onclick 提交两次？

【英文标题】：<button type="submit"> with onclick submitting twice?

【发布时间】：2013-11-16 08:04:33

【问题描述】：

我目前面临一些订单重复问题。没有过多的细节，我有一个关于以下问题的问题。有没有可能触发两次提交？

<button type="submit" onclick="review.save()"></button>

review.save() 将处理表单的提交 - 所以实际上这里不需要 type=submit。但我想确定这是否会导致浏览器提交两次。在服务器日志上，2 次提交相隔大约 10 秒。

【问题讨论】：

浏览器不提交twiche。单击按钮时，它会提交。您的函数调用 review.save() 所做的是在另一个页面上... ;)

不耐烦的用户可能会点击两次？禁用按钮是个好主意，这样用户就不能点击两次。

【参考方案1】：

您需要阻止默认浏览器行为，例如：

<button type="submit" onclick="review.save(); return false;"></button>

【讨论】：

或者<button type="button" onclick="review.save()">？但是您能确认原始代码是实际原因吗？

@FrancisKim：是的，您发布的代码也应该足够了，因为您在review.save 中提交了表单。当单击按钮并且您的 review.save() 正在执行另一个提交时，提交按钮会导致提交操作。

这个fiddle 可能会有所帮助。第一个和第三个按钮只执行点击操作，而第二个按钮执行点击操作以及提交。

【参考方案2】：

将return false 添加到您的按钮或更好的“oncklick”事件！

喜欢：

<button type="submit" onclick="review.save();return false;"></button>

它“停止”跟随链接的默认浏览器行为（在这种情况下）。

编辑：放慢速度：/