在“onfocus”事件中检查CapsLock ON

时间:2012-08-09 10:26:28

标签: javascript jquery onfocus key-events

以下用于检查Capslock是否启用的代码在“onkeypress”事件中正常工作。

但我希望它用于“onfocus”活动。  我尝试用“onfocus”替换“onkeypress”作为控件,但它对我不起作用。

有任何帮助吗? (在javascript或Jquery中)

 <script type="text/javascript" language="Javascript">
    function capLock(e) {
        kc = e.keyCode ? e.keyCode : e.which;
        sk = e.shiftKey ? e.shiftKey : ((kc == 16) ? true : false);
        if (((kc >= 65 && kc <= 90) && !sk) || ((kc >= 97 && kc <= 122) && sk))
            document.getElementById('divMayus').style.visibility = 'visible';
        else
            document.getElementById('divMayus').style.visibility = 'hidden';
    }
</script>

<input type="text" name="txtuname" />
<input type="password" name="txtPassword" onkeypress="capLock(event)" />
<div id="divMayus" style="visibility:hidden">Caps Lock is on.</div> 

3 个答案:

答案 0 :(得分:5)

有一个名为capslockstate的jQuery插件,可以跟踪大写锁定键的状态,允许您在需要时使用该信息。

它将监视整个页面的状态,然后您可以在所需元素获得焦点时检索状态。

它也基于观看按键,但不限于较低的ASCII字符,并处理按下大写锁定键本身的情况。

您的情况会变得像:

<script src="{path-to}/jquery-capslockstate.js"></script>
<script>
    $(document).ready(function() {
        $(window).capslockstate();

        $(window).bind("capsOn", function(event) {
            if ($("#txtPassword:focus").length > 0) {
                document.getElementById('divMayus').style.visibility = 'visible';
            }
        });
        $(window).bind("capsOff capsUnknown", function(event) {
            document.getElementById('divMayus').style.visibility = 'hidden';
        });
        $("#txtPassword").bind("focusout", function(event) {
            document.getElementById('divMayus').style.visibility = 'hidden';
        });
        $("#txtPassword").bind("focusin", function(event) {
            if ($(window).capslockstate("state") === true) {
                document.getElementById('divMayus').style.visibility = 'visible';
            }
        });
    });
</script>

<input type="text" name="txtuname" />
<input type="password" name="txtPassword" id="txtPassword" />
<div id="divMayus" style="visibility:hidden">Caps Lock is on.</div>

请注意,我只是jQueryified基本位,仍然可以做更多。

答案 1 :(得分:1)

似乎无法检测大写锁定 我想这可以帮到你,请访问这个

http://jaspreetchahal.org/jquery-caps-lock-detection-plugin/

答案 2 :(得分:0)

不幸的是 - 事件对象的keyCode属性仅在基于键的事件上发送(出于显而易见的原因),这就是为什么它无法在onfocus,onclick等上工作。

没有任何其他JavaScript方法可以做到这一点 - 尽管如果你使用闪存有一个潜在的解决方案 - 但这对你的要求来说似乎有些过分......