[转载]用Javascript评估用户输入密码的强度

 1 用Javascript评估用户输入密码的强度
 2 
 3 1.如果密码少于5位，那么就认为这是一个弱密码。
 4 2.如果密码只由数字、小写字母、大写字母或其它特殊符号当中的一种组成，则认为这是一个弱密码。
 5 3.如果密码由数字、小写字母、大写字母或其它特殊符号当中的两种组成，则认为这是一个中度安全的密码。
 6 4.如果密码由数字、小写字母、大写字母或其它特殊符号当中的三种以上组成，则认为这是一个比较安全的密码。
 7 本程序将根据用户输入的密码分别显示不同的颜色表示密码的强度，具体程序如下：
 8 <scriptt language=javascriptt> 
 9 //CharMode函数 
10 //测试某个字符是属于哪一类. 
11 function CharMode(iN){ 
12 if (iN>=48 && iN <=57) //数字 
13 return 1; 
14 if (iN>=65 && iN <=90) //大写字母 
15 return 2; 
16 if (iN>=97 && iN <=122) //小写 
17 return 4; 
18 else 
19 return 8; //特殊字符 
20 } 
21 //bitTotal函数 
22 //计算出当前密码当中一共有多少种模式 
23 function bitTotal(num){ 
24 modes=0; 
25 for (i=0;i<4;i++){ 
26 if (num & 1) modes++; 
27 num>>>=1; 
28 } 
29 return modes; 
30 } 
31 //checkStrong函数 
32 //返回密码的强度级别 
33 function checkStrong(sPW){ 
34 if (sPW.length<=4) 
35 return 0; //密码太短 
36 Modes=0; 
37 for (i=0;i<sPW.length;i++){ 
38 //测试每一个字符的类别并统计一共有多少种模式. 
39 Modes|=CharMode(sPW.charCodeAt(i)); 
40 } 
41 return bitTotal(Modes); 
42 } 
43 //pwStrength函数 
44 //当用户放开键盘或密码输入框失去焦点时，根据不同的级别显示不同的颜色 
45 function pwStrength(pwd){ 
46 O_color="#eeeeee"; 
47 L_color="#FF0000"; 
48 M_color="#FF9900"; 
49 H_color="#33CC00"; 
50 if (pwd==null||pwd==''){ 
51 Lcolor=Mcolor=Hcolor=O_color; 
52 } 
53 else{ 
54 S_level=checkStrong(pwd); 
55 switch(S_level) { 
56 case 0: 
57 Lcolor=Mcolor=Hcolor=O_color; 
58 case 1: 
59 Lcolor=L_color; 
60 Mcolor=Hcolor=O_color; 
61 break; 
62 case 2: 
63 Lcolor=Mcolor=M_color; 
64 Hcolor=O_color; 
65 break; 
66 default: 
67 Lcolor=Mcolor=Hcolor=H_color; 
68 } 
69 } 
70 document.getElementById("strength_L").style.background=Lcolor; 
71 document.getElementById("strength_M").style.background=Mcolor; 
72 document.getElementById("strength_H").style.background=Hcolor; 
73 return; 
74 } 
75 </scriptt> 
76 <form name=form1 action="" > 
77 输入密码:<input type=password size=10 onKeyUp=pwStrength(this.value)
78 onBlur=pwStrength(this.value)> 
79 <br>密码强度: 
80 <table width="217" border="1" cellspacing="0" cellpadding="1"
81 bordercolor="#cccccc" height="23" style='display:inline'> 
82 <tr align="center" bgcolor="#eeeeee"> 
83 <td width="33%" id="strength_L">弱</td> 
84 <td width="33%" id="strength_M">中</td> 
85 <td width="33%" id="strength_H">强</td> 
86 </tr> 
87 </table> 
88 </form>