隐式表单提交是指在表单中不使用提交按钮,而是在聚焦 input
元素时,使用其他方式(如回车键、JavaScript 等)来触发表单提交。
事实证明,这只在两种情况下是可能的:
- 表单有一个提交按钮
- 表单只有一个
input
元素
<form onsubmit="alert(1)">
<!-- 当 foo 被聚焦时,如果你按下回车,这将发出警告 -->
<input name="foo" />
</form>
<form onsubmit="alert(2)">
<!-- 这不会 -->
<input name="foo" />
<input name="bar" />
</form>
但你可以通过添加一个隐藏的提交按钮来解决这个问题。
<input type="submit" hidden />
它也明确在规范定义。
虽然隐式表单提交在某些情况下是可行的,但它并不总是有效。
例如,在使用隐式表单提交时,可能会导致用户在不知情的情况下提交表单,从而导致意外的数据提交。
另外当使用回车键来触发表单提交时,在文本输入框中回车将会提交表单,这可能不是用户想要的操作。如果使用 JavaScript 触发表单提交,可能会导致在 JavaScript 功能被禁用的情况下无法提交表单。
因此,使用显示的提交按钮是更好的选择,以确保用户能够明确地知道表单正在被提交并能够控制提交的时机。