⌨️
键码查看器
按下任意键，实时显示 key、code、keyCode、修饰键状态，前端键盘事件调试必备。
本地处理 · 不上传
加载工具中…
相关：keycode · 键码 · keyboard · event · 按键 · 调试
键码查看器实时显示按下的按键对应的 key、code 与 keyCode 值，方便编写键盘事件处理逻辑。按一下就知道该判断哪个值。
使用步骤
- 点击页面激活焦点
- 按下任意按键
- 查看各项键值
- 对照编写事件判断
使用场景
- 开发快捷键功能时确认键值
- 排查键盘事件不触发的原因
- 处理不同键盘布局的差异
- 调试游戏或编辑器的按键响应
小贴士
- `code` 表示物理按键位置，`key` 表示按下后产生的字符。做游戏的 WASD 移动应该用 code，做输入判断应该用 key。
- keyCode 已被废弃，新代码应使用 key 或 code，虽然目前浏览器仍保留兼容。
- 组合键要通过事件对象的 ctrlKey、shiftKey、altKey、metaKey 判断，它们不体现在 key 值里。
常见问题
key 和 code 该用哪个？
关心「按了哪个物理键」用 code，它不受键盘布局影响，法语 AZERTY 键盘上的 A 位置对应的 code 仍是 KeyQ。关心「输入了什么字符」用 key。
为什么 keyCode 不推荐了？
它的取值在不同浏览器和布局下不一致，规范已将其标记为废弃。虽然还能用，但新代码应该迁移到 key 与 code。
怎么判断 Ctrl+S 这类组合？
在 keydown 事件里同时判断 `e.key === 's'` 和 `e.ctrlKey`。Mac 上要额外判断 metaKey，因为对应的是 Command 键。
键码查看器是免费的吗？
是。本站所有工具完全免费，无需注册登录、无广告干扰，打开即用。
使用键码查看器，我的数据安全吗？
安全。该工具在你的浏览器本地完成处理，输入内容不会上传到服务器，隐私更有保障。