TypeScript中如何正确获取backspace退格键的keyCode

你写的代码拿不到退格键的核心原因有两个：

1. 第二段代码变量名拼写错误：判断逻辑里写了e.keyCode，但你传入的事件参数名是event，e未定义会直接抛引用错误，后续逻辑根本不会执行
2. 用了已经废弃的非标准API做兼容判断，window.event、event.which都是旧IE时代的遗留实现，现代开发不需要做这类兼容，反而容易引入问题

推荐写法（无兼容问题，符合最新Web标准） #

不需要记keyCode数值，直接用标准化的KeyboardEvent.key属性判断，退格键固定返回字符串Backspace，TypeScript原生自带这个值的类型提示：

document.addEventListener("keydown", (event: KeyboardEvent) => {
  if (event.key === 'Backspace') {
    console.log('已触发退格键');
    // 退格键对应逻辑写在这里
  }
})

如果必须取keyCode数值的兼容写法 #

退格键对应的keyCode固定为8，不需要做多余的全局事件判断，直接从回调参数里取值即可：

document.addEventListener("keydown", (event: KeyboardEvent) => {
  const backspaceKeyCode = 8;
  // 优先用标准key判断，降级用keyCode适配极老环境
  const isPressBackspace = event.key === 'Backspace' || event.keyCode === backspaceKeyCode;
  
  if (isPressBackspace) {
    console.log('退格键keyCode:', event.keyCode);
  }
})

注意事项 #

• 不要使用event.which，该属性已经被W3C标记为废弃，所有主流浏览器都已移除对它的标准支持
• 给事件参数显式标注KeyboardEvent类型，TS就会自动推导所有键盘事件的合法属性，不会报类型错误
• 如果在input、textarea或者可编辑DOM上监听退格键，随意调用event.preventDefault()会阻断用户正常的删除操作

内容的提问来源于stack exchange，提问作者Rehan Rehan