JavaScript中监听键盘按键应使用keydown事件，优先通过event.key（语义值）和event.code（物理键位）识别按键，结合ctrlKey等修饰键状态判断组合键，并用e.repeat避免重复触发。

在 JavaScript 中监听键盘按键按下事件，主要使用 keydown 事件，配合事件对象的 key、code 或 keyCode（已废弃）属性来识别具体键位。推荐优先使用 key 和 code，语义清晰且兼容性好。

监听 keydown 事件

给目标元素（通常是 document 或输入框）绑定 keydown 事件监听器：

Alibabacloud Sdk Client Initialization For Java

在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。

下载

• 监听全局按键：用 document.addEventListener('keydown', handler)
• 监听特定输入框：如 inputEl.addEventListener('keydown', handler)
• 注意：若元素不可聚焦（如 div），需添加 tabindex="0" 才能捕获键盘事件

区分 key 和 code 属性

event.key 表示按键的语义值（即用户“想输入什么”）：
– 按下 A（未 Shift）→ "a"；按下 Shift+A → "A"
– 按下 Enter → "Enter"；Escape → "Escape"
– 按下 Ctrl → "Control"（不触发字符输入）

event.code 表示物理键位（与键盘布局无关）：
– 无论中英文输入法或大小写状态，按最左侧字母区的 A 键，code 始终是 "KeyA"
– Enter 键恒为 "Enter"，右侧小键盘的回车是 "NumpadEnter"

✅ 推荐组合判断：比如检测「按住 Ctrl 并按下 S」保存操作，应同时检查 e.ctrlKey 和 e.key === 's'（忽略大小写）或 e.code === 'KeyS'（更稳定）。

常用键的判断方式

• 方向键：e.key === 'ArrowUp' / 'ArrowDown' / 'ArrowLeft' / 'ArrowRight'
• 功能键：e.key === 'F1'、e.key === 'Tab'、e.key === 'Escape'
• 数字/字母键：e.key === '5'、e.key === 'b'（注意大小写敏感）
• 修饰键状态：e.ctrlKey、e.shiftKey、e.altKey、e.metaKey（Mac 的 ⌘）
• 避免重复触发：如需只响应一次按键（而非长按时连续触发），可结合 e.repeat 判断：if (!e.repeat) { /* 处理 */ }

简单示例：监听 Ctrl+S 保存

document.addEventListener('keydown', e => {
  if (e.ctrlKey && e.key === 's') {
    e.preventDefault(); // 阻止浏览器默认保存行为
    console.log('执行自定义保存逻辑');
  }
});