Jquery特效四:密码强弱验证
效果图及代码如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.password {
font-size : 12px;
border : 1px solid #cc9933;
width : 200px;
font-family : arial, sans-serif;
}
.pstrength-minchar {
font-size : 10px;
}
</style>
<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript" src="Scripts/jquery.pstrength-min.1.2.js"></script>
<script type="text/javascript">
$(function () {
$('.password').pstrength();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td valign="top"><strong>密码：</strong></td>
<td><input class="password" type="password" name="Password" size="20"></td>
</tr>
</table>
</form>
</body>
</html>
jquery.pstrength-min.1.2.js：
(
function (A) {
A.extend(A.fn, { pstrength: function (B) {
var B = A.extend({ verdects: ["很弱", "弱", "中等", "好", "很好很强大"],
colors: ["#f00", "#c06", "#f60", "#3c0", "#3f0"],
scores: [10, 15, 30, 40],
common: ["password", "sex", "god", "123456", "123", "liverpool", "letmein", "qwerty", "monkey"],
minchar: 6
}, B);
return this.each(function () {
var C = A(this).attr("id"); A(this).after("<div class=/"pstrength-minchar/" id=/"" + C + "_minchar/">提示: 最少 " + B.minchar + " 位.</div>");
A(this).after("<div class=/"pstrength-info/" id=/"" + C + "_text/"></div>");
A(this).after("<div class=/"pstrength-bar/" id=/"" + C + "_bar/" style=/"border: 1px solid white; font-size: 1px; height: 5px; width: 0px;/"></div>");
A(this).keyup(function () { A.fn.runPassword(A(this).val(), C, B) })
})
}, runPassword: function (D, F, C) {
nPerc = A.fn.checkPassword(D, C);
var B = "#" + F + "_bar"; var E = "#" + F + "_text"; if (nPerc == -200) {
strColor = "#f00"; strText = "不安全的密码!";
A(B).css({ width: "0%" })
} else {
if (nPerc < 0 && nPerc > -199) {
strColor = "#ccc"; strText = "太短了！";
A(B).css({ width: "5%" })
} else {
if (nPerc <= C.scores[0]) {
strColor = C.colors[0]; strText = C.verdects[0];
A(B).css({ width: "10%" })
} else {
if (nPerc > C.scores[0] && nPerc <= C.scores[1]) {
strColor = C.colors[1]; strText = C.verdects[1];
A(B).css({ width: "25%" })
} else {
if (nPerc > C.scores[1] && nPerc <= C.scores[2]) {
strColor = C.colors[2]; strText = C.verdects[2];
A(B).css({ width: "50%" })
} else {
if (nPerc > C.scores[2] && nPerc <= C.scores[3]) {
strColor = C.colors[3]; strText = C.verdects[3];
A(B).css({ width: "75%" })
} else {
strColor = C.colors[4]; strText = C.verdects[4];
A(B).css({ width: "92%" })
}
}
}
}
}
} A(B).css({ backgroundColor: strColor });
A(E).html("<span style='color: " + strColor + ";'>" + strText + "</span>")
},
checkPassword: function (C, B) {
var F = 0; var E = B.verdects[0]; if (C.length < B.minchar) { F = (F - 100) }
else {
if (C.length >= B.minchar && C.length <= (B.minchar + 2)) { F = (F + 6) }
else {
if (C.length >= (B.minchar + 3) && C.length <= (B.minchar + 4)) { F = (F + 12) }
else {
if (C.length >= (B.minchar + 5)) { F = (F + 18) }
}
}
}
if (C.match(/[a-z]/)) { F = (F + 1) }
if (C.match(/[A-Z]/)) { F = (F + 5) }
if (C.match(//d+/)) { F = (F + 5) }
if (C.match(/(.*[0-9].*[0-9].*[0-9])/)) { F = (F + 7) }
if (C.match(/.[!,@,#,$,%,^,&,*,?,_,~]/)) { F = (F + 5) }
if (C.match(/(.*[!,@,#,$,%,^,&,*,?,_,~].*[!,@,#,$,%,^,&,*,?,_,~])/)) { F = (F + 7) }
if (C.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/)) { F = (F + 2) }
if (C.match(/([a-zA-Z])/) && C.match(/([0-9])/)) { F = (F + 3) }
if (C.match(/([a-zA-Z0-9].*[!,@,#,$,%,^,&,*,?,_,~])|([!,@,#,$,%,^,&,*,?,_,~].*[a-zA-Z0-9])/)) { F = (F + 3) }
for (var D = 0; D < B.common.length; D++) {
if (C.toLowerCase() == B.common[D]) { F = -200 } }
return F
}
})
})
(jQuery)