【问题标题】:Detecting when CAPS LOCK is ON检测 CAPS LOCK 何时打开
【发布时间】:2015-08-25 03:09:09
【问题描述】:

我有此代码用于将按键添加到密码中。如果 capslock 开启,它将触发。我从How do you tell if caps lock is on using JavaScript?得到它

$("input[type='password']").keypress(function(e) {

    var $warn = $(this).next(".capsWarn"); // handle the warning mssg
    var kc = e.which; //get keycode
    var isUp = (kc >= 65 && kc <= 90) ? true : false; // uppercase
    var isLow = (kc >= 97 && kc <= 122) ? true : false; // lowercase
    // event.shiftKey does not seem to be normalized by jQuery(?) for IE8-
    var isShift = ( e.shiftKey ) ? e.shiftKey : ( (kc == 16) ? true : false ); // shift is pressed

    // uppercase w/out shift or lowercase with shift == caps lock
    if ( (isUp && !isShift) || (isLow && isShift) ) {
        $warn.show();
    } else {
        $warn.hide();
    }

}).after(capLock());
function capLock(e){
 alert('CAPSLOCK is ON');
}

原始代码中有span中的消息:

...}).after(<span class='capsWarn error' style='display:none;'>CAPSLOCK is ON</span>);

我希望它是一条警报消息,但它没有按我预期的那样运行。加载时它应该提醒消息,但即使 capslockon 它也显示提醒。

如何让它检测密钥并显示警报?

【问题讨论】:

    标签: javascript jquery html passwords capslock


    【解决方案1】:
    $("input[type='password']").keypress(function(e) {
    
        var $warn = $(this).next(".capsWarn");//can be removed since you are just using alert
        var kc = e.which; //get keycode
        var isUp = (kc >= 65 && kc <= 90) ? true : false; // uppercase
        var isLow = (kc >= 97 && kc <= 122) ? true : false; // lowercase
        // event.shiftKey does not seem to be normalized by jQuery(?) for IE8-
        var isShift = ( e.shiftKey ) ? e.shiftKey : ( (kc == 16) ? true : false ); // shift is pressed
    
        // uppercase w/out shift or lowercase with shift == caps lock
        if ( (isUp && !isShift) || (isLow && isShift) ) {
            capLock(); // alerts "CAPSLOCK is ON"
        }
    
    });
    function capLock() {
     alert('CAPSLOCK is ON');
    }
    

    【讨论】:

    • edit 提供更多信息来解释这是如何解决问题的。纯代码答案是discouraged,因为它们不包含可搜索的内容,也不会增强读者的理解。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-12-26
    • 2016-12-18
    • 2011-10-25
    • 2012-02-22
    • 1970-01-01
    • 2021-06-18
    相关资源
    最近更新 更多