javascript - 如何使用 JavaScript 检测页面加载时(即不是按键时)的大写锁定状态？

Question

因此，我一直在研究使用 JavaScript/jQuery 检测表单大写锁定的解决方案。 stackoverflow 上有一个巨大的线程提供了许多解决方案。但唯一的问题是他们不检查 Caps Lock 是否被直接按下。他们检测是否输入了大写字母以及是否按下了 shift 键。这样做的缺点是我的 Caps Lock 警告消息在用户开始输入表单之前不会打开/关闭，这几乎不是最佳选择。这是我的代码。

document.onkeypress = function(e){
    e = e || window.event;
    var s = String.fromCharCode(e.keyCode || e.which);
    if (s.toUpperCase() === s && !e shiftKey) {
        capsWarning.style.visibility = 'visible';
    } else {
        capsWarning.style.visibility = 'hidden';
    }
}

有没有更好的方法，可以在我按下大写锁定键时使用 JavaScript 触发大写锁定消息？也就是说，在我开始输入之前不会延迟切换消息？

与 JQuery 相比，我更喜欢纯 JavaScript 解决方案。尽管如果你认为 jQuery 在这里真的非常非常好，请说出原因，我可以向我的同事施加压力，让我把它包括在这里；o

Answer 1

我已经使用了这段代码并尝试分派(dispatch)一个事件。 getModifierState ^{MSDN , MDN} 除了 false 不会返回。实际上，您将按原样发送一个字符 - “a”或“A”。无论哪种情况，它都将被硬编码。

getModifierState只有在真实按键的情况下才会返回 true。

但是 IE 11 中有一个自动 CapsLock 检测(对于 <input type="password" />)

            var eventType = "keypress";
            window.addEventListener ( eventType, function(e){
                var msg = "Key Pressed: " + String.fromCharCode(e.charCode) + "\n" + "charCode: " + e.charCode + "\n" + e.getModifierState ( "CapsLock" );
                console.log ( msg );
            }, false );

            function simulateKeyEvent() {
                var evt = document.createEvent("KeyboardEvent");
                var initMethod = typeof evt.initKeyboardEvent !== 'undefined' ? "initKeyboardEvent" : "initKeyEvent";

                evt[initMethod](
                    "keypress",         // type,
                    true,               // bubbles,
                    true,               // cancelable,
                    window,             // viewArg, 
                    0,                  // ctrlKeyArg,
                    0,                  // altKeyArg,
                    0,                  // shiftKeyArg,
                    0,                  // metaKeyArg, 
                    /* lower a */ 97,   //  keyCodeArg,
                    /* lower a */ 97    //  charCodeArg
                );
                window.dispatchEvent(evt);
            }
            simulateKeyEvent();