Element: 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。

示例

addEventListener keydown 示例

此示例會在您按下 <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}`;
}

帶有 IME 的 keydown 事件

自 Firefox 65 起，keydown 和 keyup 事件現在在輸入法編輯器組合期間觸發，以改善 CJKT 使用者的跨瀏覽器相容性（Firefox bug 354358）。要忽略所有屬於組合部分的 keydown 事件，請執行以下操作（229 是與已被 IME 處理的事件相關的 keyCode 的特殊值）：

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

規範

瀏覽器相容性

另見

• input
• keypress
• keyup