js实现keydown

监听键盘事件的实现方法

在JavaScript中，可以通过addEventListener方法监听键盘按下事件（keydown）。以下是一个基本示例：

document.addEventListener('keydown', function(event) {
  console.log('按下的键:', event.key);
  console.log('键码:', event.keyCode || event.which);
});

常用属性和方法

keydown事件对象包含多个有用属性：

• event.key：返回按下的键的字符串表示（如"Enter"、"A"等）
• event.code：返回物理键码（如"KeyA"、"Space"等）
• event.keyCode/event.which：返回键的数字代码（已废弃但广泛支持）
• event.ctrlKey/event.shiftKey/event.altKey/event.metaKey：布尔值，表示是否按下了修饰键

特定按键检测示例

检测回车键按下：

document.addEventListener('keydown', function(event) {
  if (event.key === 'Enter') {
    console.log('回车键被按下');
    // 执行相关操作
  }
});

检测组合键（如Ctrl+S）：

document.addEventListener('keydown', function(event) {
  if (event.ctrlKey && event.key === 's') {
    event.preventDefault(); // 阻止默认保存行为
    console.log('Ctrl+S被按下');
    // 执行自定义保存操作
  }
});

移除事件监听

当不再需要监听时，可以移除事件处理器：

function handleKeyDown(event) {
  console.log('按键:', event.key);
}

// 添加监听
document.addEventListener('keydown', handleKeyDown);

// 移除监听
document.removeEventListener('keydown', handleKeyDown);

实际应用注意事项

1. 在表单元素中监听时，注意事件冒泡
2. 国际键盘布局可能导致key值不同
3. 游戏开发中通常需要持续检测按键状态，可结合keydown和keyup事件
4. 移动端键盘事件行为可能与桌面端不同