bbs用户注册页面源码

<!DOCTYPE html>
<html>
  <head>
    <title>register.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<style>


  div{color:#F00; font-size:12px;}


  </style>
<script type="text/javascript">
  
 
//清除错误信息
function clearError(eid){
 

document.getElementById(eid).innerHTML="";}
/*document.getElementById("username").innerHTML="用户名不能为空!";
return false;
}*/
//显示错误信息
 function showError(eid,msg){
document.getElementById(eid).innerHTML=msg;
}
//验证用户名
function checkUsername(){
//获取输入值
var username= document.getElementById("username").value;
//1是否为空
if(username.length==0){
var msg="用户名不能为空!";
showError('nameerror',msg);
return false;


}
   


 
//2格式是否正确(要求开头是字母,其余可以是字母数字,下划线,长度6-20位)
      var pattern=/^[a-zA-Z][a-zA-Z0-9_]{5,9}$/;
       if(pattern.test(username)==false){
 var msg="用户名格式非法";
 showError('nameerror',msg);
 return false;
 
 
 }
      return true;


}
function checkemail(){
var email = document.getElementById("email").value;
if(email.length==0){
var msg ="邮箱不能为空!";
showError('emailerror',msg);
return false;
}
var pattern = /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;


if(pattern.test(email)==false){
var msg ="邮箱格式不正确!";
showError('emailerror',msg);
return false;
}
return true;
}
function checkpassword(){
var password = document.getElementById("password").value;
if(password.length==0){
var msg ="密码不能为空!";
showError('passworderror',msg);
return false;
}
 
return true;
}
function checkpassword2(){
var password2 = document.getElementById("password2").value;
var password= document.getElementById("password").value;
if(password2.length==0){
var msg ="确认密码不能为空!";
showError('password2error',msg);
return false;
}
 
if(!(password==password2)){
 
   
var msg ="密码不一致!";
showError('password2error',msg);
return false;
}
return true;

 
 
}
 
function checkqq(){
var qq = document.getElementById("qq").value;
if(qq.length==0){
var msg ="qq不能为空!";
showError('qqerror',msg);
return false;
}
var pattern=/^[1-9][0-9]{4,9}$/;
if(pattern.test(qq)==false){
var msg ="qq格式非法!";
showError('qqerror',msg);
return false;
}
return true;
}
//对提交按钮整体验证
function checkinput(){
if(checkusername()==true&&checkqq()==true&&checkemail()==true&&checkpassword()==true){
return true;


}else{
alert("请按照提示输入");
return false;

}



}




</script>
  </head>
  
  <body>
     
    <form name="form1" method="post" action="user.do">
      <table width="700" border="1" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td colspan="4" align="center">BBS用户注册</td>
        </tr>
        <tr>
          <td width="108">用户名:</td>
          <td width="402"><label for="textfield"></label>
          <input type="text" name="username" id="username" onBlur="checkUsername();" onFocus="clearError('nameerror');"></td>
           
          <td width="279"> <div id="nameerror"> </div>
            </td> <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>密码:</td>
          <td><label for="textfield2"></label>
          <input type="password" name="password" id="password" onBlur="checkpassword()"  onFocus="clearError('passworderror')" >
           </td>
          <td> <div id="passworderror"></td>
           <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>确认密码:</td>
          <td><label for="textfield3"></label>
          <input type="password" name="password2" id="password2" onBlur="checkpassword2()"  onFocus="clearError('password2error')" >
           </td>
          <td> <div id="password2error"></td><td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td height="41">性别:</td>
          <td><input type="radio" name="sex" id="radio" value="男">
          <label for="radio">男
            <input type="radio" name="sex" id="radio2" value="女">
          女</label></td>
          <td>&nbsp;</td>
           <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td height="29">个人爱好:</td>
          <td><p>
            <label>
             &nbsp; </label>
            
            <label>
             &nbsp; </label>
            <input type="checkbox" name="hobby" id="hobby"  value=" 文学">
            <label for="checkbox"></label>
            文学
            <input type="checkbox" name="hobby" id="hobby" value="运动 ">
            <label for="checkbox2"></label>
            运动 
            <input type="checkbox" name="hobby" id="hobby"  value="读书">
            <label for="checkbox3"></label>
            读书<br>
          </p></td>
          <td>&nbsp;</td>
          <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>出生日期:</td>
          <td><label for="select"></label>
            <select name="year" id="select">
            <option value="1990">1990</option>
            <option value="1991">1991</option>
            <option value="1992">1992</option>
            <option value="1993">1993</option>
            <option value="1994">1994</option>
            <option value="1995">1995</option>
          </select>
            年</td>
          <td>&nbsp;</td>
          <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>所在城市:</td>
          <td><label for="select2"></label>
            <select name="city" id="city">
            <option value="济南">济南</option>
             <option value="临沂">临沂</option>
              <option value="济宁">济宁</option>
               <option value="日照">日照</option>   <option value="潍坊">潍坊</option>
          </select></td>
          <td>&nbsp;</td>
          <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>电子邮件:</td>
          <td><label for="textfield2"></label>
          <input type="text" name="email" id="email" onBlur="checkemail()"  onFocus="clearError('emailerror')" ></td>
          <td><div id="emailerror"></td>
          <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td>QQ:</td>
          <td><label for="textfield3"></label>
          <input type="text" name="qq" id="qq" onBlur="checkqq()"  onFocus="clearError('qqerror')"></td>
          <td><div id="qqerror"> </td>
          <td width="108">&nbsp;</td>
        </tr>
        <tr>
          <td colspan="4" align="center"><input type="submit" name="button" id="button" value="提交">
          <input type="submit" name="button2" id="button2" value="重置"></td>
        </tr>
      </table>
    </form>
    <br>
  </body>
</html>

猜你喜欢

转载自blog.csdn.net/LY2422836708/article/details/48526067