Js密码强度设置

JavaScript判断密码强度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
     <title>密码强度测试</title>
</head>
<script language="javascript" type="text/javascript">
     //CharMode函数
     //测试某个字符是属于哪一类.
     function CharMode(iN){
         if (iN>=48 && iN <=57) //数字
         return 1;
         if (iN>=65 && iN <=90) //大写字母
         return 2;
         if (iN>=97 && iN <=122) //小写
         return 4;
         else
         return 8; //特殊字符
     }
     //bitTotal函数
     //计算出当前密码当中一共有多少种模式
     function bitTotal(num){
         modes=0;
         for (i=0;i<4;i++){
         if (num & 1) modes++;
         num>>>=1;
         }
         return modes;
     }
     //checkStrong函数
     //返回密码的强度级别

     function checkStrong(sPW){
         if (sPW.length<=4)
         return 0; //密码太短
         Modes=0;
         for (i=0;i<sPW.length;i++){
         //测试每一个字符的类别并统计一共有多少种模式.
         Modes|=CharMode(sPW.charCodeAt(i));
         }
         return bitTotal(Modes);
     }

     //pwStrength函数
     //当用户放开键盘或密码输入框失去焦点时,根据不同的级别显示不同的颜色
     function pwStrength(pwd){
         O_color="#e0f0ff";
         L_color="#FF0000";
         M_color="#FF9900";
         H_color="#33CC00";
         if (pwd==null||pwd==''){
             Lcolor=Mcolor=Hcolor=O_color;
         }
         else
         {
             S_level=checkStrong(pwd);
             alert(S_level);
             switch(S_level)
             {
                 case 0:
                 Lcolor=Mcolor=Hcolor=O_color;
                 case 1:
                 Lcolor=L_color;
                 Mcolor=Hcolor=O_color;
                 break;
                 case 2:
                 Lcolor=Mcolor=M_color;
                 Hcolor=O_color;
                 break;
                 default:
                 Lcolor=Mcolor=Hcolor=H_color;
             }
         }

         document.getElementById("strength_L").style.background=Lcolor;
         document.getElementById("strength_M").style.background=Mcolor;
         document.getElementById("strength_H").style.background=Hcolor;
         return;
     }

</script>
<body>
     <form id="form1">
     <div>
         输入密码:<input type=text ID="TextBox1" onKeyUp=pwStrength(this.value) onBlur=pwStrength(this.value) ><br />
         密码强度:
         <table border="1" cellpadding="1" borderColorDark="#fdfeff" borderColorLight="#99ccff" cellspacing="1" style=" 200px; display: inline; background-color:#e0f0ff">
             <tr>
                 <td id="strength_L" style=" 100px; height: 19px;" align="center">
                     弱</td>
                 <td id="strength_M" style=" 100px; height: 19px;" align="center">
                     中</td>
                 <td id="strength_H" style=" 100px; height: 19px;" align="center">
                     强</td>
             </tr>
         </table>
     </div>
     </form>
</body>
</html>