为什么onClick被enter键调用

Javascript why onClick getting called by enter-key

本文关键字：调用 enter onClick 为什么      更新时间：2023-09-26

我有一个带有onClick-event的按钮和一个带有onKeyDown-event的文本域。

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

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

当您在文本字段中按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>

如果表单中有一个<button>元素(如果按钮的目的是不提交表单)，而没有将类型指定为type="button"，则会遇到这种情况。

相关文章：