javascript - 为什么在提交表单时单击按钮？

Question

比如说，我有一个带有文本输入和提交按钮的表单。

如果表单中没有按钮，只需提交事件触发器，但如果至少有一个按钮没有类型属性或带有 type="submit"，它也会点击它。

现在，当我在输入中输入内容然后按 Enter 键时，我看到按钮点击和表单提交事件都被触发了。

示例:

<form>
  <input type="text" />
  <button onclick="alert('submitted');">Submit</button>
</form>

我想表单会在表单提交事件中自动点击按钮。

我想知道这种行为的起源和原因？为什么提交表单时需要点击按钮？

Answer 1

From the spec :

4.10.22.2 Implicit submission

If the user agent supports letting the user submit a form implicitly (for example, on some platforms hitting the "enter" key while a text field is focused implicitly submits the form), then doing so for a form whose default button has a defined activation behaviour must cause the user agent to run synthetic click activation steps on that default button.

6.3 [synthetic click] Activation

Certain elements in HTML have an activation behaviour, which means that the user can activate them. This triggers a sequence of events dependent on the activation mechanism, and normally culminating in a click event, as described below.

The user agent should allow the user to manually trigger elements that have an activation behaviour, for instance using keyboard or voice input, or through mouse clicks. When the user triggers an element with a defined activation behaviour in a manner other than clicking it, the default action of the interaction event must be to run synthetic click activation steps on the element.

See full script here

---

因此，按 Enter 被处理为在您的麦克风(使用语音输入设备)中说 submit。您的浏览器应该像用户单击按钮一样正确处理单击事件附加功能，并提高不能使用鼠标的用户的可访问性。