检测不同系统和键盘上键入的密钥的最佳方法?

我正在处理这个特殊输入,我需要允许/禁止用户键入一些键。

我在做验证 onKeyDown 汉德勒。

我一开始就是这么做的:

const ALLOWED_KEYS = [
  "Ctrl", "Meta", "Shift","Home", "End", 
  "Backspace", "Delete", "ArrowLeft", "ArrowRight", "Tab", 
  "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", 
  ".", ","
];

function onKeyDown(event) {
  if (ALLOWED_KEYS.indexOf(event.key) === -1) {
    event.preventDefault();
  }
}

但我担心键的字符串名称在不同浏览器中不一致,所以有人告诉我应该改为 event.keyCode 而不是 event.key .

在这个链接上,我可以查看每个关键代码: https://www.w3.org/2002/09/tests/keys.html

const DIGITS_COMMA_POINT_KEY_CODES = [
  48,49,50,51,52,53,54,55,56,57,        // 0-9 NORMAL KEYBOARD
  96,97,98,99,100,101,102,103,104,105,  // 0-9 NUMERIC KEYPAD
  110,188,                              // COMMA NORMAL AND NUMERIC KEYPAD
  190,194                               // POINT NORMAL AND NUMERIC KEYPAD
];

function onKeyDown(event) {
  if (DIGITS_COMMA_POINT_KEY_CODES.indexOf(event.keyCode) === -1) {
    event.preventDefault();
  }
}

无论如何,这两个选项都在Chrome桌面上运行,但在Chrome Mobile上失败了。

当我测试 keyCodes 从我的Android移动设备上,我得到了完全不同的号码:

例子:

KEY CODES FOR THE CHAR "0"

DESKTOP NORMAL KEYBOARD : 48
DESKTOP NUMERIC KEYPAD : 96
ANDROID MOBILE KEYBOARD : 229  (EVERY DIGIT SHOW AS 229)

-----------------

KEY CODES FOR THE CHAR "," (COMMA)

DESKTOP NORMAL KEYBOARD : 188
DESKTOP NUMERIC KEYPAD : 110
ANDROID MOBILE KEYBOARD : 229   (EVERY DIGIT, COMMA AND POINT SHOW AS 229)

注:在安卓手机上,所有数字、逗号和点似乎都会返回 keyCode 像 229 在…上 https://www.w3.org/2002/09/tests/keys.html

更新1:

刚刚测试过 event.charCode 但每把钥匙都记录为 charCode: 0

更新2:

在这个链接上: https://javascript.info/keyboard-events 我的Android Chrome手机上的每一个按键都显示为 Unidentified 真奇怪。

更新3:

这是Chrome Mobile的一个问题。Firefox Mobile可以完美地处理它。还没有在其他浏览器上测试过。

Keycode is always zero in Chrome for Android

2012年,Chromium杂志报道了这一缺陷:

https://bugs.chromium.org/p/chromium/issues/detail?id=118639

问题

什么是检测键盘、浏览器或系统上的按键的通用方法?