zoukankan      html  css  js  c++  java
  • JS判断Caps Lock

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GB2312" />
    <title>检测大写锁定键</title>
    <style type="text/css">
    <!--
    *{margin:0;padding:0;}
    body{padding:2em;background:#242424;color:#ccc;}
    h1{text-align:center;line-height:200%;}
    h3{text-indent:1em;line-height:160%;color:#666;font-weight:normal;font-size:1em;}
    h3 a{color:#bbb; text-decoration:none;margin:0 0.5em;}
    h3 a:hover{color:#fff;}
    p{margin:5em;}
    span{margin:0 0.5em;font-size:85.7%;}
    -->
    </style>
    </head>

    <body>
    <h1>检测大写锁定键&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h1>
    <form action="#" method="post">
    <p><label for="password">密码:</label><input type="password" id="password" name="password" /><span style="display:none;">大写锁定键被按下,请注意大小写</span></p>
    </form>
    <script type="text/javascript">
    //<![CDATA[
    function  detectCapsLock(event){
        var e = event||window.event;
        var o = e.target||e.srcElement;
        var oTip = o.nextSibling;
        var keyCode  =  e.keyCode||e.which; // 按键的keyCode
        var isShift  =  e.shiftKey ||(keyCode  ==   16 ) || false ; // shift键是否按住
         if (
         ((keyCode >=   65   &&  keyCode  <=   90 )  &&   !isShift) // Caps Lock 打开,且没有按住shift键
         || ((keyCode >=   97   &&  keyCode  <=   122 )  &&  isShift)// Caps Lock 打开,且按住shift键
         ){oTip.style.display = '';}
         else{oTip.style.display  =  'none';}
    }
    document.getElementById('password').onkeypress = detectCapsLock;
    //]]>
    </script>
    </body>
    </html>

    转自:

    http://www.cnblogs.com/xiaoao808/archive/2008/07/31/1257624.html

  • 相关阅读:
    结对编程作业
    软件工程网络15个人阅读作业1
    Java课程设计——学生基本信息管理
    JAVA课程设计
    201521123102 《Java程序设计》第12周学习总结
    201521123102 《Java程序设计》第11周学习总结
    201521123102 《Java程序设计》第9周学习总结
    个人作业5——软工个人总结
    alpha阶段个人总结
    案例分析
  • 原文地址:https://www.cnblogs.com/xjyggd/p/1309662.html
Copyright © 2011-2022 走看看