为什么现在不推荐用 keyCode 判断按键?

3 个讲解板块 · 关联 1 款站内工具 · 内容最后核对 2026-10-12

同一个物理键在不同键盘布局上会产出不同的字符、相同的键位;keyCode 记的是别人家浏览器当年的约定,不是标准。

直接答案

键盘事件上有三个常见字段:key 给的是这次按键产生的字符或键名,会随键盘布局与修饰键变化;code 给的是物理键位,换布局也不变;keyCode 给的是数字,已从规范中废弃。

数字这套约定来自早期浏览器,标点与非美式布局上的数值从未完全统一,同一个键在不同浏览器或系统上可能给出不同数字,所以拿数字做判断最容易在特定语言环境下失效。

选哪个看目的:想知道用户打出了什么字符,用 key;想让快捷键跟着手指位置走、不随布局漂移,用 code。两个都要,就分别判断。

键盘事件是交互里最基础的一环,也最容易留下隐患:开发机上跑得好好的快捷键,换一台法语键盘就失灵。

这一篇把三个字段的取值差异摆在一起,讲清各自的适用场景与两个高频陷阱。

1同一个键,三种取法给出什么

以按下大写状态的字母键为例,三个字段的返回值完全不同。

字段返回值形态受布局与修饰键影响
key字符或键名,如小写字母、方向键名称受影响,反映最终产生的字符
code物理键位名,如字母键位、数字键位不受影响,只反映位置
keyCode数字不受影响,但数值无标准保证

判断按键是不是字母,用 key 更直接;判断玩家有没有按到移动键位,用 code 才稳。

2三种需求对应三种选法

把需求写成一句话,选法基本就定了。

需求该用理由
输入框里识别回车提交key关心的是产生的字符与键名
游戏移动键位code换键盘布局后手指位置不变
按住修饰键组合成快捷键key 加修饰键布尔值组合语义由字符决定
区分左右两侧的修饰键code 或位置字段key 无法区分左右

要兼容很老的浏览器才需要数字方案,新项目没有理由再引入它。

3两个高频陷阱

一个关于输入法,一个关于按住不放。

中文输入法组合态
输入法组字过程中按键事件的字符字段会给出特定状态值,此时不应触发快捷键,否则打字会误触
长按重复触发
按住不放会连续触发按键事件,事件里带重复标记,写移动逻辑时要据此忽略后续事件
大小写与修饰键
大写锁定与按下修饰键都会改变字符,判断字母时要注意同时接受大小写
不要用数字做映射表
一旦必须用数字,也要在表里注明来源与适用范围,并补上字符分支

输入法组字期间误触发快捷键,是中文场景下最常见的交互缺陷。

相关疑问

老代码里全是数字判断,要不要改?

不影响功能就先不动,但新增逻辑一律用字符或键位判断,避免继续扩散这套无标准的数值。

为什么同一个键在不同浏览器上数字不一样?

这套数值从来不是标准的一部分,标点与特殊键上各家取值存在差异,所以它不可靠。

判断按下的是哪个字母,用哪个?

用字符字段,并同时接受大小写两种取值,或者先统一转换大小写再比较。

左右两侧的修饰键怎么区分?

字符字段分不出来,需要看键位字段或位置字段,右侧与左侧的取值不同。

内容标识:本页内容由人工智能辅助生成,并经人工核对与编辑。详见 人工智能生成内容标识说明。
内容说明:本页针对具体使用问题作答,方法步骤与数值由本站自行整理与复算,事实性内容以对应官方规范与文档为准。内容最后核对日期:2026-10-12。若发现错误,欢迎通过页脚反馈入口告知。