Keycode 查看

怎么用

1. 先点一下页面任意位置让浏览器获得焦点，然后按任意键。
2. 大方块显示 event.key；旁边的卡片显示 event.code、旧版 event.keyCode 等。
3. 按住修饰键时，Ctrl、Alt、Shift、Meta 四个徽章会点亮。
4. 在测试输入框里打字同样会触发监听——方便确认输入框视角下按键的样子。
5. 历史列表保留最近八次按键，方便对照。

常见用法

• 实现快捷键 —— 确认该用哪个 event.code，让快捷键在任何键盘布局下都成立。
• 布局调试 —— 看非 QWERTY 布局实际报告的键是什么。
• 游戏输入 —— 接 handler 之前核对键码与长按重复行为。
• 讲解事件 —— 演示 key（字符）与 code（物理键位）的区别。

常见问题

问：key 和 code 为什么不一样？ 答：event.key 是产生的字符（随布局变化），event.code 是物理键位（与布局无关）。写快捷键应优先用 code，这样 AZERTY 键盘上 KeyZ 依然是 Ctrl+Z。

问：keyCode 被废弃了吗？ 答：是的——keydown 与 keyup 应该用 key 或 code。这里保留旧数字是因为老代码和速查表还在引用它，对照一下省得再搜一次。

问：方向键为什么会滚动页面？ 答：本工具只监听、不阻止默认行为，所以方向键和 Tab 照常工作。你自己写快捷键代码时，在处理到按键后调用 preventDefault() 即可。