如何检测同时按下的两个字符（键）

Question

一个重要的区别是，更容易知道是否同时按下cntrl和z，但检测是否同时按下z和则不那么简单。x检测同时按下多个字符时的最佳方法是什么？

Answer 1

此示例使用事件侦听器来跟踪包含当前按下的所有键的对象。

我们可以使用这个对象来检查是否按下了某些键。这意味着我们可以检测用户键盘允许的尽可能多的同时按键操作。

重要的是，它可以让您检测到同时按下多个字符的情况。

const keysPressed = {};

document.addEventListener('keydown', (event) => {
  if (!event.repeat)
    keysPressed[event.key] = true;
  
  //You can also include event.repeat as a condition in your cases if you wish an event to only occur once each trigger.
  //You can also include Object.keys(keysPressed).length === 2 (for example) if you only wish the case to be valid if just two keys are pressed.
  //Finally, instead of event.key === 'x' you can write keysPressed['x']. This would replace both non-default cases in the example. The result is that the event will continue firing if another key is pressed.
  switch (true) { //You use true here because we are using logic to determine each case
    case event.key === 'x' && keysPressed['z']:
    case event.key === 'z' && keysPressed['x']:
      console.log('Z and X pressed!');
      break;
    default:
      break;
  }
});

document.addEventListener('keyup', (event) => {
  if (!event.repeat)
    delete keysPressed[event.key];
});