计算机专业毕业设计:密码强度动态判断
引言
天使将会展现网站编程最真实的一面,包括编程中遇到的一些错误指令的处理,网站调试过程,排查代码错误等。通过本系列经验,相信你在.net网站开发方面会有一个很大的提升。同时也希望小伙伴们喜欢天使的经验,把我的经验分享给更多需要帮助的人。后面功能模块比较深入,大家不懂的可以先看看前面的经验。
修改用户密码保护账号安全
在会员个人中心界面,我们可以修改用户密码,为了保护个人账号的安全,我们引导用户设置强密码。为了方便使用正则表达式,我们采用input控件,并将它转化为客户端控件,然后用div标签显示用户密码强度判断结果。我们可以保存用于显示密码强度的图片。
样式代码
在head标记之间,写样式代码。如下所示:
```
body {
font-size:12px;
font-family: Arial, Helvetica, sans-serif;
margin:0;
}
form {
margin:2em;
}
#chkResult {
margin-left:53px;
height:15px;
}
```
密码强度判断函数
我们使用JavaScript编写密码强度判断函数。如下所示:
```
function chkpwd(obj) {
var t ;
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 bImg ""; //一张显示用的图片
var sWidth 300;
var sHeight 15;
var Bobj ("chkResult");
"12px";
col[id];
sWidth "px";
sHeight "px";
sHeight "px";
"url(" bImg ") no-repeat left " sty[id] "px";
"20px";
"检测提示:" msg[id];
}
//定义检测函数,返回0/1/2/3分别代表无效/差/一般/强
function getResult(s) {
if (s.length < 4) {
return 0;
}
var ls 0;
if ((/[a-z]/ig)){
ls ;
}
if ((/[0-9]/ig)){
ls ;
}
if ((/([^a-z0-9])/ig)){
ls ;
}
if (s.length < 6 ls > 0){
ls--;
}
return ls;
}
```
密码强度显示
保存,单独运行该界面,输入新密码,随着密码位数和复杂度的增加,会显示相应的密码强度颜色。
版权声明:本文内容由互联网用户自发贡献,本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。