如何检测在 Javascript keyup 事件中何时按下 Shift+NumKey？

Question

我编写了以下代码，如果在键盘上按下 [Shift]，则写入控制台“true”，否则写入“false”。

<script>

    var el = document.getElementById("myInput");

    el.addEventListener("keyup", function (e) {            

        console.log(e.shiftKey);            

    });

</script>

出于某种原因，当通过按 10 键上的数字触发事件时，此代码不起作用。如果我按住 Shift 并按 Numpad5，它会记录错误。我在 Chrome、Firefox 和 IE 中看到了相同的行为。

当按下 10 键上的数字时，我需要能够检测用户是否按住 [Shift]。

编辑：为了回应@sagar 的评论，我专门用 1-10 键进行了测试，因为这是我希望我的用户按下的键。其他键暂时将被忽略。我希望能够判断用户何时按下数字 1-10 的键以及是否按下了 [Shift]。

Answer 1

使用用户必须按下才能执行此操作的键号创建一个对象：const KeysEnum = {&nbsp; &nbsp; &nbsp; &nbsp; "ENTER": 16,&nbsp; &nbsp; &nbsp; &nbsp; "SHIFT": 13,}let keysPressed = {};const handleEventShiftAndEnterPress = () => {&nbsp; &nbsp; &nbsp; console.log ('User Press Shift Enter');}window.document.addEventListener ('keydown', function (event) {&nbsp; &nbsp; &nbsp; keysPressed[event.keyCode.toString()] = true;&nbsp; &nbsp; if (keysPressed [KeysEnum.SHIFT] && keysPressed [KeysEnum.ENTER]) {&nbsp; &nbsp; &nbsp; &nbsp;handleEventShiftAndEnterPress ();&nbsp; &nbsp; &nbsp; &nbsp;keysPressed [KeysEnum.SHIFT] = false;&nbsp;&nbsp; &nbsp; &nbsp; keysPressed [KeysEnum.ENTER] = false;&nbsp; &nbsp; }});只要你控制击键对象，你就可以随时做和知道每个键的状态，所以很容易做你需要的:)

Answer 2

你可以e.getModifierState("NumLock") status根据它是 ON 还是 OFF来确定你的条件，因为当它打开时你e.shiftKey是false，如果它关闭你e.shiftKey是true按Num lock测试var el = document.getElementById("myInput");el.addEventListener("keyup", function(e) {&nbsp; console.log(e.getModifierState("NumLock"))});<input type="text" id="myInput" />

Answer 3

不幸的是，这似乎是 Windows 操作系统的一种限制，我不知道为什么存在这种限制。我在 StackOverflow 上看到过开发人员在其他上下文中遇到同样问题的例子。现在，这里有一个似乎有效的解决方案。我不喜欢它，我认为我不应该这样做，但这是我能找到的最好的东西。我发现当 NumLock 开启时，如果我按住 [Shift] 并按下 [Num5]，则会在 [Num5] 的 keydown 事件之前立即触发来自 [Shift] 的 keyup 事件。在我的工作站上，如果我获取这两个事件的时间戳，它们将是 5 毫秒或更短的部分。我只是编写了代码来检查这两个时间戳，如果它们相距 10 毫秒或更短，我的应用程序就会响应输入，考虑到用户按住 [Shift] 并按下 [Num5]。由于此代码在浏览器中运行，我认为其他平台不会有此限制，它仍然会检查事件以指示 [Shift] 被按下。