用户注册表单验证-优快云博客

本文链接：https://blog.youkuaiyun.com/t1137471535/article/details/7467064

<!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" />
<title>无标题文档</title>
<script Xlanguage="javascript">
function passfun(){
var upass=document.getElementById("upass").value;
if(upass.length==0 || upass.length<6)
  document.getElementById("myspan").innerHTML="<font color='red'>密码不能小于6位！</font>";
else
  document.getElementById("myspan").innerHTML="<font color='green'>正确！</font>";
}
function fonload(){
document.getElementById("uname").focus();
}
function yearClick(){
var ubyear=document.getElementById("ubyear");
ubyear.value="";
ubyear.focus();
}
function fucCheckNUM(NUM)
{
var i,j,strTemp;
strTemp="0123456789";
if ( NUM.length== 0)
return 0
for (i=0;i<NUM.length;i++)
{
j=strTemp.indexOf(NUM.charAt(i));
if (j==-1)
{
   return 0;
}
}
return 1;
}
function isEMailAddr(elem) {
var str = elem.value;
var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
if (!str.match(re)) {
  return false;
} else {
  return true;
}
}
function validate(){
var flag=true;
var uname=document.getElementById("uname");
var upass=document.getElementById("upass");
var reupass=document.getElementById("reupass");
var ubyear=document.getElementById("ubyear");
var uhobby=document.getElementsByName("uhobby");
var uemail=document.getElementById("uemail");
var str="";

if(uname.value.length==0)
  str+="用户名不能为空！\n";

if(upass.value.length==0)
  str+="密码不能为空！\n";
else if(upass.value.length<6){
  str+="密码不能少于6位！\n";
  upass.value="";
  upass.focus();
  flag=false;*/
}

if(reupass.value!=upass.value){
  str+="两次输入的密码不一致！\n";
   reupass.value="";
   reupass.focus();
   flag=false; */
}
if(ubyear.value.length!=4 || fucCheckNUM(ubyear.value)==0){
  str+="年份输入格式错误！\n";
  ubyear.value="";
  ubyear.focus();
  flag=false; */
}
if(uhobby.length>0){
  var f=false;
  for(var i=0;i<uhobby.length;i++){
   if(uhobby.item(i).checked)
    f=true;
  }
  if(!f){
   str+="至少选择一个兴趣爱好！\n";
  }
}
if(isEMailAddr(uemail)){
  str+="不是有效的e-mail地址!\n";
}
if(str!=""){
  alert(str);
  return false;
}

return true;
}
</script>
</head>

<body Xonload="fonload()">
<h2>用户注册表单的验证</h2>
<form name="frm" action="" method="post" Xonsubmit="return validate();">
<table border="1" width="80%">
<tr><td>用户名：</td><td><input name="uname" type="text" id="uname" size="20" /></td>
<td><font color="#FF0000">*</font></td>
</tr>
<tr><td>密码：</td><td><input name="upass" type="password" id="upass" size="20" Xonchange="passfun()"/></td>
<td><font color="#FF0000">*</font> <span id="myspan">密码不能小于6位</span></td>
</tr>
<tr><td>确认密码：</td><td><input name="reupass" type="password" id="reupass" size="20" /></td>
<td><font color="#FF0000">*</font></td>
</tr>
<tr><td>性别：</td><td><input name="usex" type="radio" value="男" checked="checked"/>男<input name="usex" type="radio" />女</td>
<td> </td>
</tr>
<tr><td>出生日期：</td><td><input name="ubyear" type="text" id="ubyear" Xonclick="yearClick()" value="yyyy" size="5"/>
年
<select name="ubmonth">
    <option value="1">一</option>
    <option value="2">二</option>
    <option value="3">三</option>
    <option value="4">四</option>
</select>
月
<input name="ubdate" type="text" size="4" />日</td>
<td><font color="#FF0000">*</font></td>
</tr>
<tr><td>兴趣爱好：</td><td><input name="uhobby" type="checkbox" />运动<input name="uhobby" type="checkbox" />编程<input name="uhobby" type="checkbox" />玩游戏</td>
<td><font color="#FF0000">*</font></td>
</tr>
<tr><td>移动电话：</td><td><input name="umobile" type="text" id="umobile" size="20" /></td>
<td> </td>
</tr>
<tr><td>电子邮箱：</td><td><input name="uemail" type="text" id="uemail" size="20" /></td>
<td><font color="#FF0000">*</font></td>
</tr>
<tr><td>头像：</td><td><input name="upic" type="file" /></td>
<td> </td>
</tr>
<tr><td><input type="submit" value="提交" /></td><td><input type="reset" value="重置" /></td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>

JS对form表单的验证