<html>
<head>
<title>My JSP 'JsTry.jsp' starting page</title>
</head>
<script type="text/javascript">
function check()
{
var pw1 = document.getElementById("pw1");
var pw2 = document.getElementById("pw2");
var div2 = document.getElementById("div2");
if(pw1.value==""&&pw2.value=="") { div2.innerHTML="" }
else
{
if(pw1.value==pw2.value)
{
div2.style.color="green";
div2.innerHTML="验证密码正确 √";
}
else
{
div2.style.color="red";
div2.innerHTML="验证密码错误";
}
}
}
function check2()
{
var pw1 = document.getElementById("pw1");
var span11 = document.getElementById("span11");
var span22 = document.getElementById("span22");
if(pw1.value=="")
{
span11.style.display="none";
span22.style.display="none";
}
else if(pw1.value.length<=5)
{
span11.style.display="";
span11.style.color="red";
span22.style.display="";
span11.style.letterSpacing="-0.6em";
span22.innerHTML="密码安全级别低";
}
else if(pw1.value.length<=10)
{
span11.style.color="yellow";
span22.style.display="";
span11.style.letterSpacing="-0.5em";
span22.innerHTML="密码安全级别中";
}
else
{
span11.style.color="green";
span22.style.display="";
span11.style.letterSpacing="-0.4em";
span22.innerHTML="密码安全级别高";
}
}
</script>
<body>
<table >
<tr>
<td align="right">
用户名<input type="text" >
</td>
<td>
</td>
</tr>
<tr>
<td align="right">
密码<input type="password" id="pw1" onKeyUp="check();check2()">
</td>
<td>
<span style="color:red;letter-spacing: -0.6em;display:none;" id="span11">
■■■■■■■■■■■
</span>
<span id="span22">
</span>
</td>
</tr>
<tr>
<td align="right">
请再次输入密码<input type="password" id="pw2" onKeyUp="check()">
</td>
<td >
<div id="div2">
</div>
</td>
</tr>
</body>
</html>
原文:http://yxc0433-126-com.javaeye.com/blog/553819