使用更改事件防止两次提交表单答案

【问题标题】：Prevent submit form twice with change event使用更改事件防止两次提交表单
【发布时间】：2013-03-12 20:46:40
【问题描述】：

我有一个带有隐藏提交按钮和一个文本输入的表单。在文本输入中，使用 jQuery 我附加了一个提交表单的更改事件。问题是，如果我在输入中按 Enter，则表单会提交两次。我认为是因为输入提交表单并且输入检测到更改事件并再次提交表单。我有两个问题： - 我的想法对吗？ - 我该如何解决这个问题？

这是javascript：

$("input.price").live('change', function () {
  $(this).closest('form').submit();
});

编辑：我认为 e.preventDefault() 阻止了事件“更改”的默认设置，但没有阻止事件“提交”..我在事件“更改”之前尝试这个没有运气但也许我关闭了解决办法：

$("input.price").live('submit', function (e) {
       e.preventDefault();
});

【问题讨论】：

标签： jquery form-submit double-submit-prevention

【解决方案1】：

$("input.price").live('change', function (eventObject) {
     eventObject.preventDefault();
     $(this).closest('form').find('input.submitButton').click();
 });

【讨论】：

【解决方案2】：

您需要使用preventDefault() 函数来阻止表单提交。

例如

$("input.price").live('change', function (e) {
  e.preventDefault();
  $(this).closest('form').find('input.submitButton').click();
});

【讨论】：

【解决方案3】：

我在这里缺少什么，你为什么不这样做呢：

$("input.price").live('change', function (eventObject) {
     $(this).closest('form').submit();
 });

【讨论】：

谢谢，我只是改变它。（但问题依然存在）
如果您使用我展示的方法提交表单，您可以删除隐藏的提交按钮吗？
是的，迈克，我删除了按钮。但双重提交仍然存在
我认为我们需要查看更多代码。您所描述的没有多大意义，除非您在某个地方意外绑定了多次。

【解决方案4】：

最后我想出了一个解决方案！问题是……正如 Mike C. 所说，额外的代码可以帮助解决问题。问题是我尝试提交的表单是 MVC 的 Ajax.BeginForm，所以.. 主要问题是该表单的 ajax 提交，这是第二次提交！

我无法改变这种行为.. 只能用 Html.Beginform 改变 Ajax.Beginform.. 我不想做的事情。所以..我想出了这个“生锈”的解决方案：

$("input.price").live('keypress', function (e) {
     if (e.keyCode == 13) {
        $(this).attr('data-submitting', true);
     }
});

$("input.price").live('change', function (e) {
     if (!$(this).attr('data-submitting')) {
         $(this).closest('form').submit();
     }
});

【讨论】：