当提交按钮命名为 "submit" 时，为什么我的表单没有提交？

Question

我需要检查表单是否由用户提交，然后在随后以编程方式提交表单之前执行一些操作。

所以我有这个代码：

$('form').submit(function (e) {
    e.originalEvent && e.preventDefault();

     //I change some things in the form here.

    !e.isTrigger && $(this).submit();
});

这很好用，但是当表单提交按钮被命名为 "submit" 时，它就不行了。

如果按钮名为 "Submit"，它甚至可以正常工作。（大写"S"）

我很好奇这是为什么？

这是一个demo fiddle

Answer 1

您陷入了一些古老的 DOM 怪癖。即，DOM 中的表单将其所有输入元素（以及按钮）通过其各自的名称公开为属性：

<form>
  <input name="foo">
</form>

结果：

var form = document.forms[0];
form.foo === document.getElementsByName('foo')[0];

不幸的是，当您拥有名称为 submit 的任何控件时，因为它隐藏了原始表单的提交方法。

编辑： 顺便说一句，为了了解其中的许多陷阱，我建议看一下 Kangax' fantastic DOMLint documentation。

当提交按钮命名为 "submit" 时，为什么我的表单没有提交？

Why does my form not submit when the submit button is named "submit"?

forms

jquery