我正在使用hotkeys-js来抽象功能,但仍然必须让用户选择他自己的自定义快捷方式(事先不知道)。然后我尝试了@Brock Adams 的回答,以获得在输入框中按下的快捷方式的 hotkeys-js 的等效格式。
我在试验时发现的东西(在 Chrome 92 上的意大利 QWERTY 键盘布局上):
- 每个 AltGr 字符都会“丢失”修饰符属性。AltGr 可以替换为 Ctrl+Alt 组合。所以
Ctrl+Alt+E
(如在 OP 问题中)给出€
. 也是如此Ctr+Alt+5
。其他组合也有同样的问题,比如Ctrl+Alt+ò
意大利语键盘上的@
- 每个 Shifted 字符都被发现,
e.key
因为它是移动的对应物,保留了修饰符属性,因此Shift+5
打印出来Shift+%
是有问题的(考虑到 AltGr 行为)。
- 某些组合无论如何都不会触发事件。我发现为例
Ctrl+Shift+9
,Ctrl+Shift+0
,Ctrl+Shift+L
和Ctrl+Shift+Alt+D
我的键盘上。这可能是薄膜键盘的局限性。
第二点对我来说很重要,因为我们的客户习惯于 Ctrl+Shift+[Number] 组合。
我通过处理 keyCode 介于 48 和 58 之间的特殊情况并手动转换为相应的数字来解决它。它仍然没有解决任何其他用 Shift 修改的特殊字符,但鉴于它们非常依赖于键盘布局,我没有看到任何通用的解决方案。不过,我从来不知道有人想要带有特殊字符的快捷方式。
const input = document.getElementById("keyPrssInp");
input.addEventListener('keydown', e => {
input.value = `${e.ctrlKey ? 'ctrl+' : ''}${e.shiftKey ? 'shift+' : ''}${e.altKey ? 'alt+' : ''}${e.metaKey ? 'meta+' : ''}${["Control", "Shift", "Alt", "Meta"].includes(e.key) ? "" : (e.keyCode < 58 && e.keyCode > 47 ? e.keyCode - 48 : e.key)}`
e.preventDefault();
});
Press keys in here: <input type="text" value="" id="keyPrssInp">
如果不要求可读性和/或您事先知道要检查的组合键,则使用event.keyCode而不是event.key
可能更安全。