如何检测Alt+单/多位数组合按键并获取输入的数字？

• 核心思路：通过keydown和keyup事件跟踪Alt键的状态，在Alt按住期间收集输入的数字，最后拼接成目标数值。

具体实现代码 #

// 初始化状态变量
let altPressed = false;
let numberBuffer = [];

// 监听键盘按下事件
document.addEventListener('keydown', (e) => {
  // 按下Alt键时，标记状态并清空缓存
  if (e.key === 'Alt') {
    altPressed = true;
    numberBuffer = [];
    return;
  }

  // Alt按住状态下，收集数字键
  if (altPressed && /^[0-9]$/.test(e.key)) {
    numberBuffer.push(e.key);
    // 可选：阻止数字键的默认行为（比如输入到输入框）
    e.preventDefault();
  }
});

// 监听键盘松开事件
document.addEventListener('keyup', (e) => {
  // 松开Alt键时，处理收集到的数字
  if (e.key === 'Alt') {
    altPressed = false;
    if (numberBuffer.length > 0) {
      const result = parseInt(numberBuffer.join(''), 10);
      console.log('获取到的数字：', result);
      // 这里写后续处理逻辑，比如使用result做业务操作
      // 处理完清空缓存，准备下一次输入
      numberBuffer = [];
    }
  }
});

关键细节说明 #

• 状态精准控制：用altPressed变量标记Alt键的按住状态，确保只有在Alt按住时才收集数字，避免误触发。
• 数字过滤：通过正则/^[0-9]$/.test(e.key)只收集0-9的数字按键，排除其他按键的干扰。
• 默认行为处理：如果页面存在输入框等元素，添加e.preventDefault()可以避免数字被输入到表单中，可根据实际需求选择是否保留。
• 缓存独立性：每次按下Alt时清空数字缓存，处理完结果后也清空缓存，保证每次Alt+数字组合的输入都是独立的。

测试时按住Alt连续按下42，松开Alt后控制台就会输出42，直接使用result变量即可进行后续业务处理。

内容的提问来源于stack exchange，提问作者Three Year Old