用JavaScript验证密码强度,仿Microsoft注册
<html>
<head>
<style type="text/css">
<!--
#iSM {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 0px 15px; PADDING-TOP: 0px; HEIGHT: 14px
}
#iSM UL {
BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 0px; MARGIN: 4px 0px 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none; TEXT-ALIGN: center; BORDER-RIGHT-WIDTH: 0px
}
#iSM UL LI {
PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 1px; HEIGHT: 14px; TEXT-ALIGN: center
}
#iWeak {
PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 9pt; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iMedium {
PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 9pt; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iStrong {
PADDING-RIGHT: 2px; DISPLAY: block; PADDING-LEFT: 2px; FONT-SIZE: 9pt; PADDING-BOTTOM: 2px; WIDTH: 84px; COLOR: #adadad; PADDING-TOP: 2px; BACKGROUND-COLOR: #f1f1f1; TEXT-ALIGN: center
}
#iWeak {
BORDER-RIGHT: #dedede 1px solid
}
#iMedium {
BORDER-RIGHT: #dedede 1px solid
}
#iMedium {
WIDTH: 84px
}
#iMedium {
BORDER-LEFT-WIDTH: 0px
}
#iStrong {
BORDER-LEFT-WIDTH: 0px
}
-->
</style>
<script type="text/javascript" language="JavaScript">
function checkPassword(pwd)
{
var objLow=document.getElementById("iWeak");
var objMed=document.getElementById("iMedium");
var objHi=document.getElementById("iStrong");
if(pwd.length==0)
{
objLow.style.background = "#f1f1f1";
objMed.style.background = "#f1f1f1";
objHi.style.background = "#f1f1f1";
}
else
{
if(pwd.length<4)
{
objLow.style.background = "#ff0033";
objMed.style.background = "#f1f1f1";
objHi.style.background = "#f1f1f1";
}
else
{
var p1= (pwd.search(/[a-zA-Z]/)!=-1) ? 1 : 0;
var p2= (pwd.search(/[0-9]/)!=-1) ? 1 : 0;
var p3= (pwd.search(/[^A-Za-z0-9_]/)!=-1) ? 1 : 0;
var pa=p1+p2+p3;
if(pa==1)
{
objLow.style.background = "#ff0033";
objMed.style.background = "#f1f1f1";
objHi.style.background = "#f1f1f1";
}
else if(pa==2)
{
objLow.style.background = "#ffff33";
objMed.style.background = "#ffff33";
objHi.style.background = "#f1f1f1";
}
else if(pa==3)
{
objLow.style.background = "#66ff66";
objMed.style.background = "#66ff66";
objHi.style.background = "#66ff66";
}
}
}
}
</script>
</head>
<body>
密码:<input >
<DIV id=iSM>
<UL>
<LI id=iWeak>弱 </LI>
<LI id=iMedium>中 </LI>
<LI id=iStrong>强 </LI>
</UL>
</DIV>
</body>
</html>