Javascript为什么onClick被enter键调用

【问题标题】：Javascript why onClick getting called by enter-keyJavascript为什么onClick被enter键调用
【发布时间】：2015-10-16 09:26:39
【问题描述】：

我有一个带有 onClick 事件的按钮和一个带有 onKeyDown 事件的文本字段。

Button: onclick="myFunc(3)"
Textfield: onKeyDown="if(event.keyCode==13) myFunc(3);"

如果我按下回车键，按钮就会被调用，但我不知道为什么。

【问题讨论】：

我们需要很多更多信息才能有效地回答这个问题。
请发布您的相关 HTML。特别是，按钮是提交按钮吗？另外，你怎么知道按钮点击被触发了，因为你在两种情况下都调用了相同的函数？

标签： javascript onclick key enter

【解决方案1】：

当您在文本字段中按 Enter 时，您会触发表单提交，并且浏览器会模拟单击表单的第一个提交按钮。

您可以通过阻止 keypress（不是 keydown）事件的默认操作来避免这种情况。

var s = document.querySelector('[type=submit]');
var t = document.querySelector('[type=text]');
var f = document.querySelector('form');

t.addEventListener('keydown', function(event) {
  if (event.keyCode == 13) {
    alert("enter pressed")
  }
});

t.addEventListener('keypress', function(event) {
  if (event.keyCode == 13) {
    event.preventDefault();
  }
});

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

【讨论】：

那是我的其他理论，但考虑到问题缺少有关表单的任何信息或按钮是提交...