KeyDown、KeyUp 和已棄用的 KeyPress 事件有什麼不同？

了解KeyPress、KeyUp 和KeyDown 事件

要區分keypress、keyup 和keydown 事件，請將它們視為與滑鼠事件類似：點選、滑鼠向上和滑鼠向下。 onKeyDown 事件在按下任意鍵時觸發，類似於 mousedown。

OnKeyUp 事件在放開按鍵時觸發，類似於 mouseup。重要的是要了解，您可以釋放一個按鍵 (onKeyUp)，而無需先按下它 (onKeyDown)。這種情況通常發生在按住按鍵然後最終釋放並觸發這兩個事件時。

OnKeyPress，但是，現在已棄用，應替換為 onKeyDown。它曾經組合了 onKeyDown 和 onKeyUp 事件，行為類似於 onKeyPress，但不再建議這種用法。

Webkit 瀏覽器的例外

基於 WebKit 的瀏覽器引入了一個額外的事件：文字輸入。此事件發生在按鍵和按鍵之間，特別是在輸入文字時。 WebKit 瀏覽器中的事件順序如下：

• Keydown
• Keypress
• TextInput
• Keyup

TextInput

Keyup

互動示範

window.addEventListener("keyup", log);
window.addEventListener("keypress", log);
window.addEventListener("keydown", log);

function log(event) {
  console.log(event.type);
}

要視覺化事件觸發序列，請嘗試以下程式碼片段：此程式碼在按下或釋放每個按鍵時將事件類型記錄到控制台。它將幫助您了解這些事件的差異和順序。

以上是KeyDown、KeyUp 和已棄用的 KeyPress 事件有什麼不同？的詳細內容。更多資訊請關注PHP中文網其他相關文章！