为什么一个有一个文本INPUT的FORM在输入时提交，而一个有两个文本INPUTs的FORM则不提交

Why does a FORM with one text INPUT submit on enter while one with two text INPUTs does not?

本文关键字：FORM 提交 文本 一个 两个 INPUTs INPUT 有一个 为什么 输入      更新时间：2023-09-26

我刚刚发现，当按下Enter键时，只包含一个INPUT（未隐藏）的FORM将自动提交。

但是，当按下回车键时，包含至少两个INPUTS（未隐藏）的表单将不会提交。

（没有一个脚本内部有提交/按钮/输入[类型=提交]）

看看这个jsfidle。这种行为有解释/标准吗？

<form id="form1" method="POST">
    <p>Does submit:</p>
    <input type="text" placeholder="focus and press enter"/>
</form>
<form id="form2" method="POST">
    <p>Does <strong>not</strong> submit:</p>
    <input type="text" placeholder="does not submit"/>
    <input type="text" placeholder=""/>
</form>

这种行为是在HTML2.0规范中引入的。有关更多详细信息，请参阅以下文章：

表单提交和ENTER键？

当表单中只有一个单行文本输入字段时用户代理应接受在该字段中输入作为提交请求表单

来源：W3C规范

这是一个特定于浏览器的实现。某些版本的IE实际上默认情况下不会这样做，但Firefox和其他一些浏览器认为，对于一个只有一个文本框的表单，用户（或页面设计者）总是希望该表单在Enter上从该字段提交。

事实上，我已经多次不得不围绕这一点进行编码。在我看来，这是一个更值得怀疑的浏览器设计决策。

编辑：

如果你感兴趣的话，你的问题会有更微妙的答案。显然，不同的浏览器（以及它们的不同版本）在这种特定情况下有不同的行为，包括它们是否提交，click事件是否发生，等等。如果你想阅读更多，我可以提供更多信息的链接。

但简单的答案是，如果不是在浏览器中得到一致支持，它实际上是有意的。

添加以下内容应能在IE中工作。

$(document).ready(function() { 
    $('input,select').keypress(function(event) { return event.keyCode != 13; }); 
  });

相关文章：