html - 浏览器不一致 : Working around FORM submission differences

Question

https://jsfiddle.net/516amfmL/2/ -- 点击进入表单输入，回车

<form onsubmit="return false;">

  <button style="display: none !important;" onclick="alert('!! Should NOT see this !!');">Hidden Button</button>

  Click in input, press ENTER: <input type="text" />

  <p>
    <button onclick="alert('this is okay');">Visible button</button>
  </p>

</form>

当运行上述 JS Fiddle 时，Chrome 和 Firefox 工作相同，MS Edge 和 Safari 做事不同。我将此列为 Chrome 中的错误，并很快被告知他们遵循 HTML 标准，该标准规定:

4.10.22.2 Implicit submission -- A form element's default button is the first submit button in tree order whose form owner is that form element.

没有人想过在标准中明确是否应该忽略隐藏元素。

无论如何，这不是我的问题。我的问题是解决此问题的最佳方法是什么？

Answer 1

表单上的隐藏按钮仍然处于事件状态并且一直如此，但很自然地认为它会或应该被自动忽略。

解决您的问题的一个可能方法是将第一个按钮更改为 <input type="button"/>

<input type="button" style="display: none !important;" value="Hidden Button" onclick="alert('!! Should NOT see this !!');"/>

这适用于 Chrome 和 Edge。

这是你的 fiddle updated .