时间戳

首页 > 解决方案 > Why does a `click` event get triggered on my

javascript - Why does a `click` event get triggered on my

问题描述

I'm only adding a click event handler on my <button>.

document.getElementsByTagName("button")[0].addEventListener("click", event => {
  event.preventDefault();

  console.log("Click:", event);
});
<button>Press <kbd>Enter</kbd> on me</button>

(Demo link)

Nevertheless, when I tab to the button in Firefox, then press Enter, I see the click event being fired. However, I cannot see this behaviour documented anywhere. Is this standard behaviour, and can I count on it working in all browsers?

标签： javascripthtmldomaccessibilitydom-events

解决方案

这主要是因为许多作者在历史上使用点击事件编写代码，而忘记考虑不点击的用户（无论是因为他们更喜欢使用键盘进行导航，还是因为残疾而难以使用指点设备，或任何其他原因）。

该行为记录在 HTML 规范中：

HTML 中的某些元素具有激活行为，这意味着用户可以激活它们。这会触发一系列依赖于激活机制的事件，并且通常会在点击事件中达到高潮，如下所述。

…</p>

对于可访问性，键盘的 Enter 和 Space 键通常用于触发元素的激活行为。

然后继续详细解释这些步骤。

推荐阅读