软件学堂

网游分类软件分类

通过JS对密码强度进行检查

2012-11-09 来源:网络

【实例名称】

通过JS对密码强度进行检查

【实例描述】

密码强度检查一般用在网站用户注册时,用来检查用户输入的密码是否安全,此功能也是Ajax Web 2.0技术的特色。本例学习使用JavaScript实现密码强度检查。

【实例代码】

<html> <head> <title>密码强度提示-学无忧(www.xue51.com)</title> <style type="text/css"> #chkResult{margin-left:53px;height:15px;} </style> </head> <body> <form name="form1"> <label for="pwd">用户密码</label> <input type="password" name="pwd" onblur="chkpwd(this)" /> <div id="chkResult"></div> <label for="pwd2">重复密码</label> <input type="password" name="pwd2" /> </form> <script type="text/javascript"> //检测密码的方法 function chkpwd(obj) { var t=obj.value; var id=getResult(t); //定义对应的消息提示 var msg=new Array(4); msg[0]="密码太短。"; msg[1]="密码强度比较差。"; msg[2]="密码强度一般。"; msg[3]="密码强度高。"; var sty=new Array(4); sty[0]=-45; sty[1]=-30; sty[2]=-15; sty[3]=0; //消息提示对应的颜色 var col=new Array(4); col[0]="gray"; col[1]="red"; col[2]="#ff6600"; col[3]="Green";

//设置显示效果 var sWidth=300; var sHeight=15; var Bobj=document.getElementById("chkResult"); Bobj.style.fontSize="12px"; Bobj.style.color=col[id]; Bobj.style.width=sWidth + "px"; Bobj.style.height=sHeight + "px"; Bobj.style.lineHeight=sHeight + "px"; Bobj.style.textIndent="20px"; Bobj.innerHTML="密码检测提示:" + msg[id]; }

//定义检测函数,返回0/1/2/3分别代表无效/差/一般/强 function getResult(s){ if(s.length < 4){ return 0; } var ls = 0; if (s.match(/[a-z]/ig)){ ls++; } if (s.match(/[0-9]/ig)){ ls++; } if (s.match(/(.[^a-z0-9])/ig)){ ls++; } if (s.length < 6 && ls > 0){ ls--; } return ls } </script> </body> </html>

 

【运行效果】

 密码强度检查运行效果

【难点剖析】

本例的难点在于判断用户输入的密码是字母还是数字,这里使用了正则表达式。“s.match(/[a-z]/ig)”用来检测字母,“s.match(/[o一9]/ig)”用来检测数字,“s.match(/(.[^a-z0-9】)/ig)”则检查密码是否既包含字母又包含数字。

【源码下载】

为了JS代码的准确性,请点击:通过JS对密码强度进行检查 进行本实例源码下载 

上一篇:usp10.dll是什么,没有找到怎么办
下一篇:通过JS对身份证号验证

相关文章