在用户登录输入密码时,常常会有因为大写锁定开启而造成输入密码错误的情况,如果在用户大写锁定开启时给予提示,就可以尽量避免这种情况的发生。

一下是代码:


<!--
*{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>

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-07-07
  • 2022-12-23
  • 2021-11-15
  • 2021-12-13
  • 2022-12-23
猜你喜欢
  • 2021-07-26
  • 2021-06-07
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-11-17
  • 2021-11-09
相关资源
相似解决方案