你的位置:首页 > Java教程

[Java教程]js密码强度


 1 /* 2 *密码安全程度  3 *return 1 :全部为字母或者数字,或者密码长度小于6 4 *return 2 : 字母数字组成,或者字母特殊字符,或者数字和特殊字符 5 *return 3 : 字母和数字和特殊字符 6 */ 7 String.prototype.passwordStrength=function(){ 8   if(this.length>0 && this.length<=6) return 1; 9   var n1 = (this.search(/[a-zA-Z]/) != -1) ? 1 : 0,10   n2 = (this.search(/[0-9]/) != -1) ? 1 : 0,11   n3 =(this.search(/[\~\`\!\@\#\$\%\^\&\*\(\)\_\+\-\=\[\]|{\}\;\'\:\"\,\.\/\<\>\?]{1,}/) != -1) ? 1 : 0; 12   return n1+n2+n3;13 }

demo

 1 <!doctype html> 2 <html> 3  4 <head> 5 <meta charset="utf-8"> 6 <title>js密码强度</title> 7 <style type="text/css"> 8 .pw_letter{ margin-top:5px; font-size: 12px; } 9 .pw_letter label{float: left; margin-right:10px; cursor: default; font-size: 12px; line-height: 16px;;}10 .pw_letter span{ float: left; display:inline-block; width:30px; height:16px; line-height:16px; text-align:center; color:#FFF; background-color:#ccc; border-left: 1px solid #FFF;}11 .pw_letter span.pw_strength_color{ background-color:green;}12 13 </style>14 </head>15 16 <body>17 18 <input id="password" type="password" name="password" placeholder="密码" onKeyUp="setPasswordStrength(this.value.trim())">19 <div class="pw_letter"><label>安全程度</label> <span class="strength">弱</span> <span class="strength">中</span> <span class="strength">强</span> </div>20 21 22 <script type="text/javascript">23 /*24 *密码安全程度 25 *return 1 :全部为字母或者数字,或者密码长度小于626 *return 2 : 字母数字组成,或者字母特殊字符,或者数字和特殊字符27 *return 3 : 字母和数字和特殊字符28 */29 String.prototype.passwordStrength=function(){30   if(this.length>0 && this.length<=6) return 1;31   var n1 = (this.search(/[a-zA-Z]/) != -1) ? 1 : 0,32   n2 = (this.search(/[0-9]/) != -1) ? 1 : 0,33   n3 =(this.search(/[\~\`\!\@\#\$\%\^\&\*\(\)\_\+\-\=\[\]|{\}\;\'\:\"\,\.\/\<\>\?]{1,}/) != -1) ? 1 : 0; 34   return n1+n2+n3;35 }36 37 String.prototype.trim = String.prototype.trim || function(){38   return this.replace(/^\s+|\s+$/g,"");39 }40 41 function setPasswordStrength(pwd){42   var strength_span = document.getElementsByClassName("strength");43   for(var i=0; i<strength_span.length; i++){44     strength_span.item(i).className="strength"; 45   }46   for(var i=0; i<pwd.passwordStrength(); i++){47     document.getElementsByClassName("strength").item(i).className="strength pw_strength_color";48   }  49 }50 51 52 </script>53 </body>54 55 </html>

View Code