lovecoding
/
VIPJAVA


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159
							<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>register</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="https://www.jq22.com/jquery/bootstrap-4.2.1.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
    <link rel="stylesheet" href="css/style.default.css" id="theme-stylesheet">
  </head>
  <body>
    <div class="page login-page">
      <div class="container d-flex align-items-center">
        <div class="form-holder has-shadow">
          <div class="row">
            <!-- Logo & Information Panel-->
            <div class="col-lg-6">
              <div class="info d-flex align-items-center">
                <div class="content">
                  <div class="logo">
                    <h1>欢迎注册</h1>
                  </div>
                  <p>红雨车位管理系统</p>
                </div>
              </div>
            </div>
            <!-- Form Panel    -->
            <div class="col-lg-6 bg-white">
              <div class="form d-flex align-items-center">
                <div class="content">
                    <div class="form-group">
                      <input id="register-username" class="input-material" type="text" name="registerUsername" placeholder="请输入用户名/姓名" >
                      <div id="register-username-err" class="invalid-feedback">用户名必须在2~10位之间</div>
                    </div>
                    <div class="form-group">
                      <input id="register-password" class="input-material" type="password" name="registerPassword" placeholder="请输入密码"   >
                       <div id="register-passwrod-err" class="invalid-feedback">密码必须在6~10位之间</div>
                    </div>
                    <div class="form-group">
                      <input id="register-passwords" class="input-material" type="password" name="registerPasswords" placeholder="确认密码"   >
                      <div id="register-passwrods-err" class="invalid-feedback">两次密码必须相同 且在6~10位之间</div>
                    </div>
                    <div class="form-group">
                      <input id="register-phone" class="input-material" type="text" name="registerPhone" placeholder="请输入电话"   >
                      <div class="invalid-feedback">电话号码必须符合规则</div>
                    </div>
                    <div class="form-group">
                      <input id="register-email" class="input-material" type="email" name="registerEmail" placeholder="请输入邮箱"   >
                      <div class="invalid-feedback">邮箱必须符合规则</div>
                    </div>
                    <div class="form-group">
                      <button id="regbtn" type="button" name="registerSubmit" class="btn btn-primary">注册</button>
                    </div>
                  <small>已有账号?</small><a href="login.html" class="signup">&nbsp;登录</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- JavaScript files-->
    <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <script src="https://www.jq22.com/jquery/bootstrap-4.2.1.js"></script>
    <script>
    	$(function(){
          //is-invalid 验证class
          //验证用户名
          let username = document.getElementById("register-username");
          username.onblur = function (){
            let usernameFlag;
            //输入值
            let username_val = username.value
            //根据正则判断
            let reg = /^\w{6,8}$/;
            //判断
            if (reg.test(username_val)){
              console.log("符合")
              usernameErr =  document.getElementById("register-username-err");
              usernameErr.style.display = "none";
              usernameFlag = true;
            }else{
              usernameErr =  document.getElementById("register-username-err");
              usernameErr.style.display = "block";
              usernameErr.innerText = "用户名必须在6~10位之间";
              console.log("不符合")
            }
          }
          //验证密码1
          let password = document.getElementById("register-password");
          password.onblur = function (){
            let passwordFlag;
            //输入值
            let password_val = password.value
            //根据正则判断
            let reg = /^\w{6,8}$/;
            //判断
            if (reg.test(password_val)){
              passwordErr =  document.getElementById("register-passwrod-err");
              passwordErr.style.display = "none";
              passwordFlag = true;
            }else{
              passwordErr =  document.getElementById("register-passwrod-err");
              passwordErr.style.display = "block";
              passwordErr.innerText = "密码必须在6~10位之间";
              passwordFlag = false;
            }
          }
          //验证密码2
          let password2 = document.getElementById("register-passwords");
          password2.onblur = function (){
            let password2Flag;
            //输入值
            let password2_val = password2.value
            let password1_val = password.value
            console.log(password1_val + "--"+password2_val)
            //判断
            if (password2_val == password1_val){
              passwordErr2 = document.getElementById("register-passwrods-err");
              passwordErr2.style.display = "block";
              passwordErr2.innerText = "√";
              password2Flag = true;
            }else{
              passwordErr2 =  document.getElementById("register-passwrods-err");
              passwordErr2.style.display = "block";
              passwordErr2.innerText = "两次密码必须一致";
              password2Flag = false;
            }
          }

          //验证 电话号码
          var reg1 = /^[1][3|4|5|6|7|8|9]\d{9}$/;
          if (reg1.test("13100000000")){
            console.log("符合")
          }else{
            console.log("不符合")
          }
          //验证邮箱
          var reg2 = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
          if (reg2.test("123163.com")){
            console.log("符合")
          }else{
            console.log("不符合")
          }
    	})


        if(name.length<2||name.length>10){
          $("#register-username").removeClass("form-control is-valid")
          $("#register-username").addClass("form-control is-invalid");
          flagName=false;

    </script>
  </body>
</html>