使用 Enter 提交表单会在插入输入字段后中断 - 原因以及如何修复

如果HTML表单字段具有焦点并且您按回车键，则该表单将被提交(除非您做了一些花哨的事情来绕过它(。 奇怪的是，如果JavaScript在表单中添加了一个字段，那么输入提交行为似乎就会中断。 例如：

http://jsfiddle.net/SChas/1/

function goose() { 
  document.getElementById("addhere").innerHTML="<input name=goose value=honk>";
}
function checkForm() {
  alert("ok");
}​
--
<form onsubmit="checkForm();">
  <input name="duck" value="quack">
  <div id="addhere"></div>
  </form>
<button onclick="goose();">add a goose</button>

(这是一个人为的例子，试图尽可能简洁。 涉及的原始代码是更现代的代码，其中附加了 JavaScript 等事件。 但这是复制问题的最简单的代码。 此外，在实际用例中，有必要通过添加/删除字段来动态修改表单。

无论如何，你会得到一个表单，其中包含一个值为"duck"的单个字段。 单击它并按回车键，表单将提交(您将看到"确定"警报，然后JSFiddle会告诉您不要发布！

但是，如果您单击"添加鹅"，您将获得一个新字段。 现在，您无法按回车键提交表单。

为什么会这样？ 我无法通过谷歌找到有关此行为的任何信息，也许我使用了错误的搜索词。 但它至少发生在Windows上的IE和Chrome以及OSX上的FF中。 所以这似乎是一种有意的，也许是规范的行为。 是某种安全保护吗？

而且，插入字段后，有没有办法恢复表单上的输入提交行为？ 除了将 onkey* 事件添加到输入字段之外，还有什么方法？

FWIW，输入是通过DOM方法(appendChild(添加的，还是使用jQuery或老式的JavaScript设置innerHTML，似乎并不重要。