資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究如何在 JavaScript 彈出視窗中處理 ESC 鍵按下？
當我們按下 Esc 鍵時，生成的事件可以使用keyup 和keydown 事件處理程式檢測到。當按下鍵盤上的 Esc 鍵時，事件處理程式會在頁面上執行。讓我們深入瞭解這篇文章，以更好地理解如何在 JavaScript 彈出視窗中處理 Esc 鍵按下。
使用 keydown 事件
按下按鍵時，會觸發 keydown 事件。與已棄用的 keypress 事件不同，keydown 事件會針對所有按鍵呼叫，而不管它們是否生成字元值。keypress 顯示輸入了哪個字元，而 keydown 和 keyup 事件則提供一個程式碼，指示按下了哪個鍵。
語法
以下是 keydown 事件的語法
onkeydown = (event) => { };
讓我們看看下面的例子，以便更好地理解如何在 JavaScript 彈出視窗中處理 Esc 鍵按下。
示例
在下面的示例中，我們執行一個指令碼，該指令碼使用 keydown 事件指示何時按下 Esc 鍵。
<!DOCTYPE html>
<html>
<body onkeydown="esckey(event)">
<p id="tutorial"></p>
<script>
function esckey(evt) {
if (evt.keyCode == 27) {
document.getElementById("tutorial").innerHTML=('escape key was pressed')
}
}
</script>
</body>
</html>
當指令碼執行時，它將生成一個輸出，觸發事件。當用戶單擊“Esc”鍵時，它將顯示已按下“Esc”鍵。
示例
考慮以下示例，我們在這裡使用 Keydown 事件來發出警報，指示是否按下了“Esc”鍵。
<!DOCTYPE html>
<html>
<body>
<p>Click The Button and Then Press Esc Key</p>
<button id="tutorial" type="submit">click</button>
<script>
document.onkeydown = function(evt) {
evt = evt || window.event;
var isEscape = false;
if ("key" in evt) {
isEscape = (evt.key === "Escape" || evt.key === "Esc");
} else {
isEscape = (evt.keyCode === 27);
}
if (isEscape) {
alert("Escape Key Was Pressed");
}
};
</script>
</body>
</html>
執行上述指令碼後，輸出視窗將彈出，在網頁上顯示文字和一個單擊按鈕。當用戶單擊按鈕並按下 Esc 鍵時，會觸發一個事件，並顯示訊息“按下 Esc 鍵”。
示例
執行下面的指令碼，並觀察每當按下 Esc 鍵或其他鍵時事件是如何觸發的。
<!DOCTYPE html>
<html lang="en">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<body>
<script>
$(document).keydown(function (eventValue) {
if (eventValue.keyCode == 27) {
document.write("ESC key is pressed....");
} else {
document.write("Some other is key pressed....")
}
});
</script>
</body>
</html>
當指令碼執行時，它會生成一個輸出，觸發事件，並在使用者按下按鍵時顯示文字；例如，如果使用者單擊 Esc 鍵，則顯示“按下 Esc 鍵”。
更新於：2023年4月21日
3K+ 瀏覽量
廣告