注册信息

最新推荐文章于 2022-05-28 15:31:21 发布

你的孤独虽败犹荣

最新推荐文章于 2022-05-28 15:31:21 发布

阅读量184

点赞数

本文链接：https://blog.csdn.net/zhou742626/article/details/78859666

版权

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8" />
       <title>注册信息</title>
       <style type="text/css">
           *{
               margin: 0px;
               padding: 0px;
           }
           form{
               width: 470px;
               height: 570px;
               border: 1px solid #41c7d6;
           }
           td{
               padding: 10px;
           }
           #zhu{
               width: 70px;
               height: 28px;
               position: relative;
               left: 27px;
               background: aqua;
               border: 1px solid black;
               border-radius:5px ;
           }
           #qing{
               width: 70px;
               height: 28px;
               position: relative;
               left: 57px;
               border: 1px solid black;
               border-radius:5px ;
           }
       </style>
       <script type="text/javascript" src="js/jquery-2.1.0.js"></script>
       <script type="text/javascript">
           $(function(){
               var flag1=flag2=flag3=flag4=flag5=flag6=flag7=flag8=flag9=flag10=false;
               //账号
               $("#zhang").blur(function(){
                   var zhang=$(this).val();
                   var rename = new RegExp("[a-zA-Z_][a-zA-Z_0-9]{0,}","");
                   if(zhang==""||!rename.test(zhang)){
                       alert("账号不规范");
                       flag1=false;
                   }else{
                       flag1=true;
                   }
               });
               //密码
               $("#pwd").blur(function(){
                   var pwd=$(this).val();
                   var rename = new RegExp("[A-Z][a-zA-Z_][a-zA-Z_0-9]{0,}","");
                   if(pwd==""||!rename.test(pwd)){
                       alert("密码不规范");
                       flag2=false;
                   }else{
                       flag2=true;
                   }
               });
               //重复密码
               $("#repwd").blur(function(){
                   var repwd=$(this).val();
                   var pwd=$("#pwd").val();
                   if(pwd==repwd){
                       flag3=true;
                   }else{
                       alert("密码不符");
                       flag3=false;
                   }
               });
               //姓名
               $("#name").blur(function(){
                   var name=$(this).val();
                   if(name==""||name=="我是昵称1"||name=="我是昵称2"){
                       alert("昵称重复/不规范");
                       flag4=false;
                   }else{
                       flag4=true;
                   }
               });
               //生日
               $("#birth").blur(function(){
                   var birth=$(this).val();
                   if(birth==""){
                       alert("出生日期不规范");
                       flag5=false;
                   }else{
                       flag5=true;
                   }
               });
               //身份证号
               $("#IDcard").blur(function(){
                   var IDcard=$(this).val();
                   var reg=/^\d+$/;
                   if(IDcard==""||!reg.test(IDcard)||IDcard.length<18||IDcard.length>18){
                       alert("身份证号不规范");
                       flag6=false;
                   }else{
                       flag6=true;
                   }
               });
               //电话
               $("#tel").blur(function(){
                   var tel=$(this).val();
                   var reg = /^1\d{10}$/;
                   if(tel==""||!reg.test(tel)){
                       alert("手机号不规范");
                       flag7=false;
                   }else{
                       flag7=true;
                   }
               });
               //QQ
               $("#qq").blur(function(){
                   var qq=$(this).val();
                   var reg=/^\d+$/;
                   if(qq==""||!reg.test(qq)||qq.length<5){
                       alert("QQ号不规范");
                       flag8=false;
                   }else{
                       flag8=true;
                   }
               });
               //邮箱
               $("#email").blur(function(){
                   var email=$(this).val();
                   var reg=/^\d+$/;
                   if(email==""||email.indexOf("@")<1){
                       alert("邮箱不规范");
                       flag9=false;
                   }else{
                       flag9=true;
                   }
               });
               //注册按钮
               $("#zhu").click(function(){
                   if(flag1&&flag2&&flag3&&flag4&&flag5&&flag6&&flag7&&flag8&&flag9){
                       alert("注册成功");
                   }else{
                       alert("信息不能为空");
                   }
               });
               //清空按钮
               $("#qing").click(function(){
                   $("input").empty();
               });
           });
       </script>
   </head>
   <body>
       <center>
           <form>
               <span>——注册———————————————————————</span><br /><br /><br />
               <table cellspacing="0" cellpadding="0">
                   <tr>
                       <td>账号</td>
                       <td><input type="text" id="zhang"/></td>
                   </tr>
                   <tr>
                       <td>密码</td>
                       <td><input type="text" id="pwd"/></td>
                   </tr>
                   <tr>
                       <td>重复密码</td>
                       <td><input type="text" id="repwd"/></td>
                   </tr>
                   <tr>
                       <td>昵称</td>
                       <td><input type="text" id="name"/></td>
                   </tr>
                   <tr>
                       <td>出生日期</td>
                       <td><input type="date" id="birth"/></td>
                   </tr>
                   <tr>
                       <td>性别</td>
                       <td><input type="radio" value="汉子" checked="checked" name="sex"/>汉子
                           <input type="radio" value="妹子" name="sex"/>妹子</td>
                   </tr>
                   <tr>
                       <td>身份证号</td>
                       <td><input type="text" id="IDcard"/></td>
                   </tr>
                   <tr>
                       <td>手机号</td>
                       <td><input type="text" id="tel"/></td>
                   </tr>
                   <tr>
                       <td>QQ</td>
                       <td><input type="text" id="qq"/></td>
                   </tr>
                   <tr>
                       <td>邮箱</td>
                       <td><input type="text" id="email"/></td>
                   </tr>
                   <tr>
                       <td colspan="2" style="text-align: center;">
                           <input type="button" value="注册" id="zhu"/>
                       <input type="reset" value="清空" id="qing"/></td>
                   </tr>
               </table>
           </form>
       </center>
   </body>
</html>