js表单注册验证

<span style="font-size:14px;"><script type="text/javascript">
function checkname(){
na=form1.yourname.value;
if( na.length <1 || na.length >12)
{
divname.innerHTML='<font class="tips_false">长度是1~12个字符</font>';
//这里可以使用alert("长度是1~12个字符");个人感觉每个输入都使用提示框输出信息，不是很友好，会让用户体验比较差！
 }else{
divname.innerHTML='<font class="tips_true">输入正确</font>';

}

}
//验证密码
function checkpassword1(){
psd1=form1.yourpass.value;
var flagZM=false ;
var flagSZ=false ;
var flagQT=false ;
if(psd1.length<6 || psd1.length>12){
divpassword1.innerHTML='<font class="tips_false">长度错误</font>';
}else
{
for(i=0;i < psd1.length;i++)
{
if((psd1.charAt(i) >= 'A' && psd1.charAt(i)<='Z') || (psd1.charAt(i)>='a' && psd1.charAt(i)<='z'))
{
flagZM=true;
}
else if(psd1.charAt(i)>='0' && psd1.charAt(i)<='9')
{
flagSZ=true;
}else
{
flagQT=true;
}
}
if(!flagZM||!flagSZ||flagQT){
divpassword1.innerHTML='<font class="tips_false">密码必须是字母数字的组合</font>';

}else{

divpassword1.innerHTML='<font class="tips_true">输入正确</font>';

}

}
}
//验证确认密码
function checkpassword2(){
if(form1.yourpass.value!=form1.yourpass2.value) {
divpassword2.innerHTML='<font class="tips_false">输入的密码不一致</font>';
} else {
divpassword2.innerHTML='<font class="tips_true">输入正确</font>';
}
}
//验证邮箱

function checkemail(){
apos=form1.youremail.value.indexOf("@");
dotpos=form1.youremail.value.lastIndexOf(".");
if (apos<1||dotpos-apos<2)
{
divmail.innerHTML='<font class="tips_false">输入错误</font>' ;
}
else {
divmail.innerHTML='<font class="tips_true">输入正确</font>' ;
}
}
</script></span>

<span style="font-size:14px;">.tips_false{color:red;font-size:12px;}
.tips_true{color:green;font-size:12px;}</span>

<form name="form1" action="#" onsubmit="return true;" method="post">
<h2 style="margin-left:50px;">用户注册</h2>
<p>
<label for="yourname">用户名：</label>
<input type="text" id="yourname" name="yourname" required onblur="checkname()" />
<div id="divname"></div>
</p>
<p>
<label for="yourpass">密码：</label>
<input type="password" id="yourpass" name="yourpass" required onblur="checkpassword1()" />
<div id="divpassword1"></div>
</p>
<p>
<label for="yourpass2">确认密码：</label>
<input type="password" id="yourpass2" name="yourpass2" required onblur="checkpassword2()" />
<div id="divpassword2"></div>
</p>
<p>
<label for="youremail">电子邮箱：</label>
<input type="email" id="youremail" name="youremail" required onblur="checkemail()" />
<div id="divmail"></div>
</p>
<p>
<input type="submit" value="注册"  onClick="return true;"/>
<input type="button" value="取消" onClick="reset()" />
</p>
<!--reset()清空所有的输入框-->
</form>