HTML 表单 onsubmit 无法在某些具有隐藏提交按钮和只读输入的浏览器上触发

Question

我正在设计一个表单，以便在按键盘上的"Enter"时触发onsubmit，并且该事件不会在某些浏览器上触发，具体取决于表单中的字段。

以下是一些触发和不触发submit的表单的最小工作示例。

Firefox，Chrome和Opera对以下表单感到满意，但Internet Explorer 11和Safari 11不会在第三种形式上触发onsubmit。

表格 1：

<form>
<input type="text">
<input type="submit" style="display:none;">
</form>

表格 2：

<form>
<input type="text">
<input readonly>
<input type="submit">
</form>

表格 3(有漏洞)：

<form>
<input type="text">
<input readonly>
<input type="submit" style="display:none;">
</form>

当按下"Enter"同时保持提交按钮隐藏并且不使用黑客按键事件处理程序时，如何让第三个表单在这些浏览器上触发submit？解释为什么第三种形式无法触发事件将非常有帮助。

为了您的方便，这是一个JSFiddle。

编辑：相关问题的已接受解决方案在提交按钮上设置display: none，这不会在Safari/IE中解决此问题。

Answer 1

使用visibility: hidden而不是display: nonedisplay: none因为元素不会接收事件

或者使用不透明度并将其绝对放置在屏幕外，这样它就不会占用任何空间，也不会出现在屏幕上

opacity: 0;
position: absolute;
left: -3000px;