参考资料

  1. HTML DOM 对image排版
  2. HTML DOM 事件
  3. HTML DOM 返回一个button的value 实例
  4. HTML DOM 给image加上border
  5. HTML DOM禁用和启用下拉列表
  6. HTML DOM 创建一个链接指向一个低分辨率的image
  7. HTML DOM 被按下的键盘键的keycode？
  8. HTML DOM 返回一个表单target属性的值

HTML DOM 被按下的键盘键的keycode？

HTML DOM 键盘事件 keyCode

介绍

keyCode 是键盘事件的属性，表示用户按下的键盘键的数字代码。虽然现在已被 key 属性取代，但在一些旧代码中仍能看到。

相关事件

  • onkeydown - 按键按下时触发

  • onkeyup - 按键释放时触发

用法

element.onkeydown = function(event) {
    var keyCode = event.keyCode;
    // 处理按键代码
};

实例

<input type="text" id="myInput">

<script>
document.getElementById("myInput").onkeydown = function(event) {
    console.log("按下的键码是: " + event.keyCode);
    if(event.keyCode === 13) { // 回车键
        alert("你按下了回车键");
    }
};
</script>

常见键码

  • 8: Backspace

  • 9: Tab

  • 13: Enter

  • 16: Shift

  • 17: Ctrl

  • 18: Alt

  • 27: Esc

  • 32: 空格

  • 37: 左箭头

  • 38: 上箭头

  • 39: 右箭头

  • 40: 下箭头

CSS 扩展

虽然 keyCode 本身与 CSS 无关，但可以通过 JavaScript 根据按键修改样式：

document.onkeydown = function(e) {
    if(e.keyCode === 32) { // 空格键
        document.body.style.backgroundColor = "lightblue";
    }
};

替代方案

现代推荐使用 event.key 替代 keyCode，因为它返回的是字符串形式的键名，更易读：

element.onkeydown = function(event) {
    console.log("按下的键是: " + event.key);
};
TAG：箭头键盘事件按键属性代码替代用户数字现在

AIGEO优化摘要

AI可读摘要：HTML DOM 键盘事件 keyCode介绍keyCode 是键盘事件的属性，表示用户按下的键盘键的数字代码。虽然现在已被 key 属性取代，但在一些旧代码中仍能看到。相关事件onkeydown - 按键按下时触发onkeyup - 按键释放时触发用法实例常见键码8: Backspace9: Tab13: Enter16: Shift17: Ctrl18:...
常见问题：
HTML DOM 被按下的键盘键的keycode？主要讲了什么？

HTML DOM 键盘事件 keyCode介绍keyCode 是键盘事件的属性，表示用户按下的键盘键的数字代码。虽然现在已被 key 属性取代，但在一些旧代码中仍能看到。相关事件onkeydown - 按键按下时触发onkeyup - 按键释放时触发用法实例常见键码8: Backspace9: Tab13: Enter16: Shift17: Ctrl18:...

HTML DOM 被按下的键盘键的keycode？适合哪些人参考？

适合正在了解文章信息、进行对比筛选，或希望快速获得结论的用户参考。

阅读HTML DOM 被按下的键盘键的keycode？时应重点看哪些内容？

建议重点关注标题、摘要、正文说明、图片资料和更新时间。

AIGEO评分：85/100
  • 建议补充封面或内容图片。
作者：王壹杰
时间：2025-04-24 18:06:11
来源：https://html.ciilii.com/