元素：keydown 事件

在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。

addEventListener("keydown", (event) => {});

onkeydown = (event) => {};

一个 KeyboardEvent。继承自 UIEvent 和 Event。

此接口也继承了其父级 UIEvent 和 Event 的属性。

KeyboardEvent.altKey 只读

返回一个布尔值，如果在生成键盘事件时 Alt（macOS 上的 Option 或 ⌥）键处于活动状态，则为 true。

KeyboardEvent.code 只读

返回一个字符串，包含事件所代表的物理键的代码值。

警告：这忽略了用户的键盘布局，因此，如果用户在 QWERTY 键盘布局中按下“Y”位置的键（位于主行上方的行中间），则始终返回“KeyY”，即使用户使用 QWERTZ 键盘（这意味着用户期望“Z”，并且所有其他属性都指示“Z”）或 Dvorak 键盘布局（用户期望“F”）。如果要向用户显示正确的按键，可以使用 Keyboard.getLayoutMap()。

KeyboardEvent.ctrlKey 只读

返回一个布尔值，如果在生成键盘事件时 Ctrl 键处于活动状态，则为 true。

KeyboardEvent.isComposing 只读

返回一个布尔值，如果事件在 compositionstart 之后和 compositionend 之前触发，则为 true。

KeyboardEvent.key 只读

返回一个字符串，表示事件所代表的键的键值。

KeyboardEvent.location 只读

返回一个数字，表示键盘或其他输入设备上键的位置。识别位置的常量列表显示在 键盘位置 中。

KeyboardEvent.metaKey 只读

返回一个布尔值，如果在生成键盘事件时 Meta 键（在 Mac 键盘上为 ⌘ Command 键；在 Windows 键盘上为 Windows 键 (⊞)）处于活动状态，则为 true。

KeyboardEvent.repeat 只读

返回一个布尔值，如果键被按住以使其自动重复，则为 true。

KeyboardEvent.shiftKey 只读

返回一个布尔值，如果在生成键盘事件时 Shift 键处于活动状态，则为 true。

此示例在您在 <input> 元素内按下任何键时记录 KeyboardEvent.code 值。

<input placeholder="Click here, then press down a key." size="40" />
<p id="log"></p>

const input = document.querySelector("input");
const log = document.getElementById("log");

input.addEventListener("keydown", logKey);

function logKey(e) {
  log.textContent += ` ${e.code}`;
}

从 Firefox 65 开始，keydown 和 keyup 事件现在在 IME 组合期间触发，以提高 CJKT 用户的跨浏览器兼容性 (Firefox bug 354358)。要忽略所有作为组合一部分的 keydown 事件，请执行以下操作（229 是为与 IME 处理过的事件相关的 keyCode 设置的特殊值）

eventTarget.addEventListener("keydown", (event) => {
  if (event.isComposing || event.keyCode === 229) {
    return;
  }
  // do something
});

• input
• keypress
• keyup