功能开发中
按键码信息
获取按键码和事件信息。
⌨️
按下任意键查看键盘码信息
详细信息
按下键盘上的任意键以查看详细信息
常见按键码参考
Enter: 13
Tab: 9
Backspace: 8
Shift: 16
Ctrl: 17
Alt: 18
Escape: 27
Space: 32
Page Up: 33
Page Down: 34
End: 35
Home: 36
关于键盘事件
键盘事件提供了多种属性来描述按键信息：
- keyCode: 已废弃，但仍广泛支持的按键码
- key: 按键的字符串表示
- code: 物理按键的字符串表示
- which: 已废弃，与keyCode类似
现代浏览器推荐使用 event.key 和 event.code 属性。
使用教程
- 打开工具后页面中心有一个醒目的按键捕获区域
- 直接在键盘上按下你想查询的按键（字母、数字、功能键、方向键均可）
- 查看捕获结果面板中展示的详细信息：
- 注意观察修饰键区域：如果你按住Ctrl再按A，可以看到Ctrl状态变为active
- 点击各属性的"复制"按钮将该值复制到剪贴板
- 查看下方的历史按键记录列表回顾之前按过的键
使用场景
- 键盘快捷键开发：为Web应用实现Ctrl+S保存、Ctrl+Z撤销等快捷键绑定时确定key/code值。
- 游戏输入系统：Canvas/WebGL游戏中映射WASD方向键和空格射击键的事件码。
- 可访问性测试：验证屏幕阅读器和辅助技术能否正确识别键盘导航的key/code。
- 遗留代码维护：理解老项目中 event.keyCode == 13 (Enter) 这类写法的含义并迁移到 modern event.key === 'Enter'。
- 虚拟键盘实现：开发屏幕键盘/软键盘组件时模拟真实的KeyboardEvent属性。
- 跨浏览器兼容：测试同一按键在不同浏览器(Chrome/Firefox/Safari/Edge)中事件的属性差异。
- 安全事件监听：监控用户输入模式检测自动化机器人(按键间隔/节奏分析)。
常见问题
Q: keyCode和code有什么区别？
A: keyCode是返回一个数字代表按键的旧API(Deprecated)；code是返回字符串标识物理按键位置的新API(如"KeyA"、"Digit1")，不受键盘布局影响。推荐在新代码中使用event.code和event.key。
Q: 为什么keyCode已被废弃还在显示？
A: 因为海量的现存网站和库(jQuery/Bootstrap等)仍依赖keyCode，理解它对维护旧代码仍然必要。本工具同时展示新旧属性方便过渡。
Q: Mac的Command键显示为什么？
A: Command键在KeyboardEvent中对应 MetaKey (event.metaKey)，code值为 "MetaLeft" / "MetaRight"。
Q: 手机端能用吗？
A: 移动端没有物理键盘，但可以通过软键盘输入触发有限的事件（通常只有key值，缺乏准确的code/keyCode）。
建议反馈 （可留下联系方式）
0/200
工具名称
按键码信息
所属分类
Web
更新时间
2026-06-24
使用次数
39
工具简介
获取按键码和事件信息。
功能特性
实时捕获：按下任意键即刻显示完整的键盘事件属性。
全面属性展示：event.key / event.code / event.keyCode / event.which 四大属性并列。
修饰键状态：Alt / Ctrl / Shift / Meta(Win/Command) 的按下/释放实时指示。
事件类型区分：keydown / keyup / keypress 三种事件类型的值差异展示。
历史记录：记录最近按过的N个按键及其属性方便回溯。
键盘布局检测：识别当前用户的键盘布局(QWERTY/AZERTY/QWERTY)。
复制快捷栏：一键复制 keyCode / code / key 值用于代码。
暂无收藏工具
收藏工具
