现在的位置: 首页 > 综合 > 正文

简单的js验证密码

2014年03月22日 ⁄ 综合 ⁄ 共 2158字 ⁄ 字号 评论关闭

来自:http://fei-xiang.javaeye.com/blog/828798

 

 

简单的js验证密码

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>密码</title>
<style type="text/css">
body {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
margin: 0;
}

form {
margin: 2em;
}

#chkResult {
margin-left: 53px;
height: 15px;
}
</style>
<script type="text/javascript">

//定义检测函数,返回0/1/2/3分别代表无效/差/一般/强
function getResult(s) {
var ls = 0;
//验证长度
if (s.length < 8) {
return ls;
}
if (s.match(/[a-z]/)){
ls++;
}
if (s.match(/[0-9]/)){
ls++;
}
if (s.match(/[A-Z]/)){
ls++;
}
if(ls==3){
return 4;
}

return ls
}
var msg = new Array(5);
msg[0] = "密码必须至少为8个字符长”。";
msg[1] = "密码必须包括所有的字符以下类型:小写字母,大写字母和数字";
msg[2] = "密码必须包括所有的字符以下类型:小写字母,大写字母和数字";
msg[3] = "密码必须包括所有的字符以下类型:小写字母,大写字母和数字";
msg[4] = "格式正确。";
function setDisplay(mark){
var sty = new Array(5);
sty[0] = -60;
sty[1] = -45;
sty[2] = -30;
sty[3] = -15;
sty[4] = 0;

var col = new Array(5);
col[0] = "gray";
col[1] = "red";
col[2] = "#ff6600";
col[3] = "#ff6611";
col[4] = "Green";

//设置显示效果
var bImg = "http://bbs.blueidea.com/attachments/2006/12/7/pwdlen_dSIPeEGQWxfO.gif";//一张显示用的图片
var sWidth = 400;
var sHeight = 15;
var Bobj = document.getElementById("chkResult");

Bobj.style.fontSize = "12px";
Bobj.style.color = col[mark];
Bobj.style.width = sWidth + "px";
Bobj.style.height = sHeight + "px";
Bobj.style.lineHeight = sHeight + "px";
Bobj.style.background = "url(" + bImg + ") no-repeat left " + sty[mark]
+ "px";
Bobj.style.textIndent = "20px";
Bobj.innerHTML = "检测提示:" + msg[mark];
}

function checkPas(){
var pas=document.getElementById("pwd").value;
var mark=getResult( pas);
//alert(msg[mark]);
}
function isSame(){

var pas=document.getElementById("pwd").value;
var rePas=document.getElementById("pwd2").value;
if(pas!=rePas){
alert("aa");
var Bobj = document.getElementById("errorMsg");
Bobj.style.fontSize = "12px";
Bobj.style.color = "red";
Bobj.innerHTML = "两次输入密码不一致";
}
//AAAbb2222
}
</script>
</head>

<body>

<form name="form1">
<label for="pwd">
用户密码
</label>
<input type="password" name="pwd" onKeyUp="setDisplay(getResult(this.value));" onblur="checkPas();"/>
<div id="chkResult"></div>
<br>
<label for="pwd2">
重复密码
</label>
<input type="password" name="pwd2" onblur="isSame();"/>
<div id="errorMsg"></div>
</form>

</body>

</html>

【上篇】
【下篇】

抱歉!评论已关闭.