<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h2>用户注册</h2>
用户名:<input type="text" size="12" /><br />
<!-- 给password密码设置事件使用onblur事件命令 -->
密码:<input id="pwd" type="password" size="12" onblur="checkpassword()" /><span id="msg_pwd">*密码长度为6位</span><br />
确认密码:<input id="rpwd" type="password" size="12" onblur="checkpasswordrepeat()"/><span id="msg_pwd_r"></span><br />
邮箱:<input id="email" type="text" size="12" onblur="checkEmail()"/><span id="msg_email">*邮箱账号必须合法</span><br />
<input type="button" value="注册" />
</body>
</html>
<script>
//校验密码长度
function checkpassword(){
elepwd=document.getElementById("pwd")
if(elepwd.value.length!=6){
document.getElementById("msg_pwd").style="color:red;"
}
}
//校验确认密码
function checkpasswordrepeat(){
elepwd=document.getElementById("pwd");
elepwdr=document.getElementById("rpwd");
if(elepwd.value!=elepwdr.value){
document.getElementById("msg_pwd_r").innerText="两次输入的密码不一致";
document.getElementById("msg_pwd_r").style="color:red;"
}
}
//校验邮箱合法性
function checkEmail(){
eleEmail=document.getElementById("email");
if(eleEmail.value.indexOf("@")==-1){
document.getElementById("msg_email").style="color:red;"
}else{
document.getElementById("msg_email").style="color:black;"
}
}
</script>
12-14
544
![](https://csdnimg.cn/release/blogv2/dist/pc/img/readCountWhite.png)