关于 键盘按键信息
在网页里处理键盘事件时，需要知道按下的键对应什么 key、code 和已废弃的 keyCode，但靠记忆很难一一对上。本工具在浏览器本地监听你的真实按键，实时显示该键的 event.key、event.code、keyCode、location 以及 Ctrl/Shift/Alt/Meta 修饰键状态，帮你写键盘快捷键、调试输入逻辑。所有按键只在本页捕获处理，不会被记录或发送到任何地方，适合写键盘快捷键、调试输入法或游戏按键逻辑时确认每个键的真实编码。写快捷键时留意不同键盘布局下同一个物理键可能返回不同的编码，跨区域用户尤其容易踩坑；确认好修饰键组合后再落到代码里，能为游戏操作、表单快捷提交与无障碍导航省下不少反复调试的时间，也让交互行为更可预期。
处理键盘交互时最常见的问题不是「按键没响应」，而是「在别人的键盘上不响应」：不同语言的输入法、不同的键盘布局、以及浏览器与操作系统的差异，都会让同一个判断逻辑表现不一致。查询工具的作用是把抽象的参数变成可观察的事实——按下某个键，看到浏览器实际上报了什么。 现代事件提供三组信息：键值表示按下的键所产生的字符，代码表示物理键位，而历史上的数字编号已经废弃。要区分「按哪个键」与「输入什么字符」，就必须理解前两者的差别：按住上档键时字符会变大写，而物理键位不变；中文输入法在确认候选词时会上报一个特殊编号，之后再触发真正的提交。 使用要点：做快捷键时不使用字符值判断字母，因为切换键盘布局后同一个物理键会产生不同字符，用物理键位判断更稳定；做输入校验时则相反，应使用字符值，因为关注的是内容而不是按键位置。输入法组合期间要显式跳过处理，否则用户在选择候选词时会被误判为提交，这在表单里表现为「输入中文时表单提前提交」。此外，涉及组合键时要注意修饰键的判定顺序，先判断组合再判断单键，避免单键规则把组合键吞掉。 边界与限制：同一功能键在不同系统上可能上报不同值，跨平台产品应以主流程可用为准并对边缘键做降级处理。历史的数字编号虽然废弃，但部分旧代码仍在依赖，迁移时需确认目标浏览器范围，不能简单假定它不存在。还有一点容易被忽略：可访问性工具与自动化测试发送的键盘事件往往只带部分字段，依赖单一字段做判断会导致自动化测试通过而真实用户失败，因此在真实设备上手动验证一遍是必要的。 数据与隐私：键盘事件本身不含个人信息，但记录按键序列可能间接暴露输入内容，因此不要在生产页面长期收集按键数据。本工具仅展示当前按键信息，不记录也不上传任何序列，可离线使用。
最常见的误用是用字符值判断快捷键：切换键盘布局后同一个物理键会产生不同字符，快捷键随即失效，而开发者自己的键盘上完全正常，于是问题被误判为「偶发」。另一个误用是忘记判断输入法的组合状态，导致用户选择候选词时表单被提交。判定逻辑应先处理组合状态，再按键位匹配。
实现原理
现代按键事件提供三组信息：字符值表示按下的键产生的字符，物理键位表示键盘上的位置，历史上的数字编号已废弃。要区分「按哪个键」与「输入什么字符」，看的就是前两者——按住上档键时字符变大写而物理键位不变；输入法确认候选词时会先发一次带组合标记的事件，随后才触发真正的提交。
按下键盘左上角的 A（英文布局，未按修饰键）key = "a"｜code = "KeyA"（物理键位）｜切到其他布局后 key 变化而 code 不变使用方法
- 打开「键盘按键信息」
- 输入或粘贴待处理的内容
- 根据需要调整输出选项
- 点击「运行」按钮，结果实时显示
- 复制或导出结果
使用场景
- 写快捷键 — 实测某个组合键触发的 key 与 code，照着写 keydown 监听不再猜值。
- 区分物理键 — 用 code 分辨左右 Shift、主键盘数字和小键盘数字等同名不同位的键。
- 兼容旧码 — 查到旧代码里 keyCode 数值对应的现代 key/code，平滑迁移到新 API。
- 布局排查 — 验证不同键盘布局下同一物理键产生的 key 是否符合预期。
- 游戏控制 — 为网页游戏映射 WASD 等按键时确认 code 值，避免受输入法影响。
常见问题
event.key 和 event.code 有什么区别？
key 表示按键产生的字符或含义，会随键盘布局和 Shift 变化（如 a 与 A）；code 表示键的物理位置，与布局无关（如 KeyA 始终是同一个物理键）。做快捷键通常用 code 更稳。
keyCode 为什么不推荐再用？
keyCode 已被标准废弃（deprecated），不同浏览器和布局下取值不一致，仅为兼容老代码保留。新项目应改用 key 或 code。
location 字段是干什么的？
location 标识同名键的位置，比如左 Ctrl 为 1、右 Ctrl 为 2、小键盘按键为 3，可用来区分主键盘和数字小键盘上的相同符号。
为什么有些组合键抓不到？
部分组合被操作系统或浏览器优先拦截（如某些 F 键、系统快捷键），事件不会冒泡到页面；这属于平台限制，网页无法覆盖。
输入法状态下键值正常吗？
中文等输入法合成阶段会触发 isComposing 状态，此时 key 可能是 Process，应在 compositionend 后再处理，避免误判按键。
同一个快捷键在我的键盘上有效，同事的却无效？
大概率是按字符值判断导致的。切换键盘布局后，同一个物理键会产生不同字符，以字符判断字母的快捷键就会失效。应改用物理键位（code）判断，它对布局不敏感；反之，若是输入校验类逻辑，则应使用字符值，因为关注的是内容而非按键位置。两者用错方向是最常见的原因。
输入中文时表单会提前提交，怎么修？
输入法在确认候选词时会先发出一次按键事件，随后才触发真正的提交。若在按键处理里不判断组合状态，选词的那一下就会被当成回车提交。修法是显式跳过组合期间的按键，或改为监听表单提交事件而不是监听按键，这样既不依赖输入法行为，也不会影响正常回车提交。
keyCode 已经废弃了，为什么还要查它？
因为大量遗留代码和内部系统仍在监听 keyCode（如 13 = Enter）。新代码应该用 event.key（Enter）或 event.code（物理键位）。这个对照表的价值在于维护老代码时快速反查，而不是在新项目里继续用 keyCode。