JavaScript即时判断输入密码的强度

源码示例：

1.javascript代码

    <script 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);
                 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>

　　2.页面代码

 <table>
             <tr>
                 <td align="center" colspan="">注册新帐户</td>
                 <td></td>
             </tr>
             <tr>
                 <td align="right">
                     <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">用户名:</asp:Label>
                 </td>
                 <td>
                     <asp:TextBox ID="UserName" runat="server" CausesValidation="True" ValidationGroup="group1"></asp:TextBox>
                 </td>
                 <td>
                          <asp:Button ID="btnCheck" runat="server" OnClick="btnCheck_Click" Text="检查该用户名是否有效" ValidationGroup="group1" />
                 </td>
                 <td>
                      <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" ErrorMessage="用户名不能为空" ValidationGroup="group1"></asp:RequiredFieldValidator>
                 </td>
             </tr>
                           <tr>
                     <td align="right">
                                昵称
                     </td>
                   <td align="left">
                       <asp:TextBox ID="txtNickName" runat="server"></asp:TextBox>
                   </td>
                     <td colspan=""></td>
                 </tr>
             <tr>
                 <td align="right">
                     <asp:Label ID="lblPassword" runat="server" AssociatedControlID="Password">密码:</asp:Label>
                 </td>
                 <td>
                     <asp:TextBox ID="Password" runat="server" TextMode="Password" onKeyUp="pwStrength(this.value)" onBlur="pwStrength(this.value)" CausesValidation="True"></asp:TextBox>
                 </td>
                 <td>
                         <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" ErrorMessage="必须填写“密码”。"></asp:RequiredFieldValidator>
                 </td>
                 <td></td>
             </tr>
             <tr>
                 <td id="strength_L" align="right" >
                     弱</td>
                 <td id="strength_M" align="center">
                     中</td>
                 <td id="strength_H" align="left">
                     强</td>
                 <td></td>
             </tr>
             <tr>
                 <td align="right">
                     <asp:Label ID="lblConfirmPassword" runat="server" AssociatedControlID="ConfirmPassword">确认密码:</asp:Label>
                 </td>
                 <td>
                     <asp:TextBox ID="ConfirmPassword" runat="server" TextMode="Password" CausesValidation="True"></asp:TextBox>
                 </td>
                 <td>
                     <asp:RequiredFieldValidator ID="ConfirmPasswordRequired" runat="server" ControlToValidate="ConfirmPassword" ErrorMessage="必须填写“确认密码”" ></asp:RequiredFieldValidator>
                 </td>
                 <td>
                     <asp:CompareValidator ID="PasswordCompare" runat="server" ControlToCompare="Password" ControlToValidate="ConfirmPassword" Display="Dynamic" ErrorMessage="“密码”和“确认密码”必须匹配。" ></asp:CompareValidator>
                 </td>
             </tr>
             <tr>
                 <td align="right">
                     <asp:Label ID="lblMail" runat="server" AssociatedControlID="Email">电子邮箱:</asp:Label>
                 </td>
                 <td>
                     <asp:TextBox ID="Email" runat="server" CausesValidation="True"></asp:TextBox>
                 </td>
                 <td>
                     <asp:RequiredFieldValidator ID="EmailRequired" runat="server" ControlToValidate="Email" ErrorMessage="必须填写“电子邮箱”。"></asp:RequiredFieldValidator>
                 </td>
                 <td>
                     <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="Email" ErrorMessage="电子邮箱格式不正确" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>
                 </td>
             </tr>
               <tr>
                     <td colspan="" align="center">
                         <asp:Button ID="btnRegist" runat="server" Text="注册" OnClick="btnRegist_Click" />
                     </td>
                   <td colspan="" align="left">
                       <input id="Reset1" type="reset" value="重置" />
                   </td>
                 </tr>
 
         </table>