代码如下:
<!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>
<script language="javascript">
function checkname(uname){
var us=document.getElementById("us");
var name=trim(uname);
if(name==null||name==""){
us.innerHTML="<font color='red'>用户名不能为空</font>"
return false;
}else if(!/^[a-zA-Z]w{0,9}$/.test(name)){
us.innerHTML="<font color='red'>用户名开头必须为字母</font>"
return false;
}
else{
us.innerHTML="";
return true;
}
}
function checkpassword(pass){
var p=document.getElementById("p");
var name=document.getElementById("name");
var password=trim(pass)
if(password==null||password==""){
p.innerHTML="<font color='red'>密码不能为空</font>";
return false;
}else if(password==name.value){
p.innerHTML="<font color='red'>密码不能和用户名相同</font>";
return false;
}else if(!/^w{6,10}$/.test(password)){
p.innerHTML="<font color='red'>密码长度必须为6-10位</font>";
return false;
}
else{
p.innerHTML="";
return true;
}
}
function checkpass(pass2){
var p2=document.getElementById("p2");
var password=document.getElementById("password");
var password2=trim(pass2)
if(password2==null||password2==""){
p2.innerHTML="<font color='red'>密码不能为空</font>";
return false;
}else if(password2!=password.value){
p2.innerHTML="<font color='red'>两次输入的密码必须相同</font>";
return false;
}else if(!/^w{6,10}$/.test(password2)){
p2.innerHTML="<font color='red'>密码长度必须为6-10位</font>";
return false;
}else{
p2.innerHTML="";
return true;
}
}
function checkemail(mail){
var e=document.getElementById("e");
var email=trim(mail)
if(email==null||email==""){
e.innerHTML="<font color='red'>电子邮箱不能为空</font>";
return false;
}else if(!/^[w-]+(.[w-]+)*@([w-]+.)+[a-zA-Z]+$/.test(email))
{
e.innerHTML="<font color='red'>请输入正确的电子邮箱</font>";
return false;
}
else{
e.innerHTML="";
return true;}
}
function trim(s){
return s.replace(/^s+|s+$/g,"");//去除空格;
}
function checkdata(){
var name=document.getElementById("name");
var pass=document.getElementById("password");
var pass2=document.getElementById("pass");
var email=document.getElementById("email");
if(!checkname(name.value)){
return false;
}
if(!checkpassword(pass.value)){
return false;
}
if(!checkpass(pass2.value)){
return false;
}
if(!checkemail(email.value)){
return false;
}
return true;
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Js表单验证_www.jb200.com</title>
</head>
<body>
<center>
<form action="#" method="post">
<table border="0" cellspacing="1" cellpadding="5">
<tr><td>用户名</td>
<td><input type="text" id="name" onblur="checkname(this.value)" name="uname"/><span id="us">
</span></td></tr>
<tr><td>密码</td>
<td><input type="password" id="password" onblur="checkpassword(this.value)" name="pass"/><span id="p">
</span></td></tr>
<tr><td>确认密码</td>
<td><input type="password" id="pass" onblur="checkpass(this.value)" name="pass2"/><span id="p2">
</span></td></tr>
<tr><td>电子邮箱</td>
<td><input type="text" id="email" onblur="checkemail(this.value)" name="mail"/><span id="e">
</span></td></tr>
</table>
<input type="submit" value="注册" onclick="return checkdata()"/> <input type="submit" value="取消"/>
</form>
</center>
</body>
</html>
2、js对中文的验证