HTML代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="javascript" src="js/1.js" type="text/javascript"></script>
<style>
body{font-size:12px;}
.frred{color:#FF0000; font-size:12px;}
.frbule{color:#0066CC; font-size:12px;}
.fgren{color:#339933; font-size:12px;}
</style>
<title>test</title>
</head>
<body>
<table>
<tr><td><a class="frred">*</a>用户名：<input name="name" id="name" type="text" onblur="checkformname()"/> <span id="sname" class="frbule">输入至少4位用户名</span></td></tr>
<tr><td><a class="frred">*</a>密 码：<input name="pwd" id="pwd" type="password" onblur="checkpwd()" /><span id="spwd" class="frbule"> 请输入至少6为密码</span></td></tr>
<tr><td><a class="frred">*</a>再次输入密码：<input name="rpwd" id="rpwd" type="password" onblur="rcheckpwd()" /><span id="srpwd" class="frbule"> 请输入重复密码</span></td></tr>
<tr><td><a class="frred">*</a>E-mail：<input name="email" id="email" type="text" onblur="checkemail()"/><span id="semail" class="frbule"> 请输入正确的邮箱地址</span></td></tr>
<tr><td><input type="submit" value="submit"/></td></tr>
</table>
</body>
</html>
JS代码
// JavaScript Document
function checkformname(){
var regname=/^w{4,10}$/;
var fname=document.getElementByIdx_x_x("name");
var ftname=document.getElementByIdx_x_x("sname");
if(fname.value==""|| fname.value.length<4||fname.value.length>10){
ftname.className="frred";
ftname.innerHTML="× 请输入4-10位用户名，可包含数字、字母、下划线";
}
else{
if(fname.value.match(regname)){
ftname.className="fgren";
ftname.innerHTML="√用户名可用!"
}
else{
ftname.className="frred";
ftname.innerHTML="× 用户名格式输入错误，请检查！";
}}
}
function checkpwd(){
var fpwd=document.getElementByIdx_x_x("pwd");
var ftpwd=document.getElementByIdx_x_x("spwd");
if(fpwd.value==""||fpwd.value.length<4||fpwd.value.length>20){
ftpwd.className="frred";
ftpwd.innerHTML="× 请输入4-20位用户密码！";
}
else{
ftpwd.className="fgren";
ftpwd.innerHTML="√密码可用！"
}
}
function rcheckpwd(){
var fpwd=document.getElementByIdx_x_x("pwd");
var frpwd=document.getElementByIdx_x_x("rpwd");
var ftrpwd=document.getElementByIdx_x_x("srpwd");
if(frpwd.value=="")
{
ftrpwd.className="frred";
ftrpwd.innerHTML="× 请输入您的重复密码！"
}
else{
if(frpwd.value!=fpwd.value)
{
ftrpwd.className="frred";
ftrpwd.innerHTML="× 俩次密码输入不一致，请重新输入！";
}
else
{
ftrpwd.className="fgren";
ftrpwd.innerHTML=" √ 密码输入正确"
}
}
}
function checkemail(){
var regemail=/^w+([-+.']w+)*@w+([-.]w+)*.w+([-.]w+)*(;w+([-+.']w+)*@w+([-.]w+)*.w+([-.]w+)*)*$/;
var femail=document.getElementByIdx_x_x("email");
var ftemail=document.getElementByIdx_x_x("semail");
if(femail.value==""){
ftemail.className="frred";
ftemail.innerHTML="× 电子邮箱不能为空！";
}
else{
if(femail.value.match(regemail)){
ftemail.className="fgren";
ftemail.innerHTML="√ 邮箱地址正确！";
}
else{
ftemail.className="frred";
ftemail.innerHTML="× 邮箱格式输入错误，请检查！";
}
}
}