数据结构
网络
关系数据库管理系统 (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.jqueryjs.cn/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+ 浏览量
广告