js实战之-密码强度

  1 <html>
  2 <head>
  3     <title>js-密码强度</title>
  4 
  5     <script language="javascript" type="text/javascript">
  6         function checkstr(str) 
  7         {
  8             if (str >= 48 && str <= 57)//数字
  9             {
 10                 return 1;
 11             }
 12             else if (str >= 65 && str <= 90)//大写字母
 13             {
 14                 return 2;
 15             }
 16             else if (str >= 97 && str <= 122)//小写字母
 17             {
 18                 return 3;
 19             }
 20             else//特殊字符
 21             {
 22                 return 4;
 23             }
 24         }
 25 
 26         function checkl(string) 
 27         {
 28             n = false;
 29             s = false;
 30             t = false;
 31             l_num = 0;
 32 
 33             if (string.length < 6) 
 34             {
 35                 l_num = 1;
 36             }
 37             else 
 38             {
 39                 for (i = 0; i < string.length; i++) 
 40                 {
 41                     asc = checkstr(string.charCodeAt(i));
 42 
 43                     if (asc == 1 && n == false)
 44                     { l_num += 1; n = true; }
 45 
 46                     if ((asc == 2 || asc == 3) && s == false)
 47                     { l_num += 1; s = true; }
 48 
 49                     if (asc == 4 && t == false)
 50                     { l_num += 1; t = true; }
 51                 }
 52             }
 53             return l_num;
 54         }
 55 
 56         function checklevel(psw) 
 57         {
 58             color = "#ededed";
 59             color_l = "#ff0000";
 60             color_m = "#ff9900";
 61             color_h = "#33cc00";
 62 
 63             
 64             if (psw == null || psw == '')
 65             {
 66                 lcor = color;
 67                 mcor = color;
 68                 hcor = color;
 69             }
 70             else 
 71             {
 72                 thelev = checkl(psw)
 73                 switch (thelev) 
 74                 {
 75                     case 1:
 76                         lcor = color_l;
 77                         hcor = mcor = color;
 78                         break;
 79                     case 2:
 80                         mcor = lcor = color_m;
 81                         hcor = color;
 82                         break;
 83                     case 3:
 84                         hcor = mcor = lcor = color_h;
 85                         break;
 86                     default:
 87                         lcor = mcor = hcor = color;
 88                 }
 89             }
 90             document.getElementById("strength_L").style.background = lcor;
 91             document.getElementById("strength_M").style.background = mcor;
 92             document.getElementById("strength_H").style.background = hcor;
 93         }
 94 
 95     </script>
 96 
 97 </head>
 98 <body>
 99     <form>
100     密码:
101     <input type="password" size="10" onKeyUp="checklevel(this.value)" onChange="checklevel(this.value)" />
102     <br /><br /><br />
103     强度:
104     <table width="210" cellspacing="1" cellpadding="0" bordercolor="#cccccc" height="9">
105         <tr align="center" bgcolor="#eeeeee">
106             <td width="33%" height="5" id="strength_L">
107             </td>
108             <td width="33%" id="strength_M">
109             </td>
110             <td width="33%" id="strength_H">
111             </td>
112         </tr>
113     </table>
114     </form>
115 </body>
116 </html>
一个不敬业的前端攻城狮
原文地址:https://www.cnblogs.com/chaoming/p/3183623.html