时间戳

首页 > 解决方案 > KeyboardEvent：按下“Shift”时如何获取数字键代码？

javascript - KeyboardEvent：按下“Shift”时如何获取数字键代码？

问题描述

在我的应用程序中，我需要确定用户是否按下了任何数字键（主键盘或小键盘）以及是否同时按下了 shift/ctrl/alt 键。

我需要这个，因为按下的键代表数组中的数字（从 0 到 9），它应该用这个数字触发一个动作。所以我的逻辑很简单：

@HostListener('document:keydown', ['$event'])
handleKeydownEvent(event: KeyboardEvent) {
  let index = Number(event.key);
  if (isNaN(index)) {
    // skip, for now
  }else{
    doAction(index);
  }
}

我喜欢它，因为它的可读性和透明度。

当我还需要处理“Alt”或“Ctrl”时，事情似乎很简单。在这些情况下，event.key 仍然表示按下的键的数字键值（如“1”或“2”）（我可以检查 event.ctrlKey/event.altKey。

但是当我需要考虑“Shift”键时，事情变得越来越复杂。在这种情况下， event.key 不代表数字键。相反，它代表其他字符，例如“！” 或者 '@'。

我想我可以通过构建地图将其转换为关键代码，但我需要处理键盘布局，因为在某些情况下 Shift+2 最终会成为'@'，在其他情况下 - '"'（俄罗斯布局 vs英语）。

按下“Shift”按钮时检测按键代码的正确和简单方法是什么？

谢谢！

标签： javascriptangularkeyboard-events

解决方案

选项：

  1. UIsng event.which：它返回数值，但已弃用。
  2. 你创建地图的想法很酷。要创建地图，请使用“event.code”，而不是使用“event.key”。

EVENT.CODE 是您的救星。

推荐阅读