你好 超人 2022-04-20 20:45 采纳率: 20%
浏览 28

html登录注册添加验证

验证密码 不能为空，必须含有数字、字母、特殊字符,长度在8-12位咋添加

<body>
<div class="bady_background" style="background:url(images/body_background1.jpg) center 0 no-repeat ;background-size:100%;width:100%;height:100%;">
    <div class="logo"><a href="index.html" alt="主页" title="主页"></a></div>
    <div class="container ">
         
        <ul class="nav nav-pills" role="tablist" id="myTab">
            <li class="active active_now"><a href="#log-in" role="tab" data-toggle="tab"><strong>登录</strong></a></li>
            <li ><a class="hover_background"  href="#login" role="tab" data-toggle="tab"><strong>注册</strong></a></li>
        </ul>
        <div class="tab-content">
            
            <div class="tab-pane active" id="login">
                                <form role="form">
                                    <div class="form-group">
                                        <!-- <label>用户名：</label> -->
                                        <input type="text" placeholder="你的昵称" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        <!-- <label>用户名：</label> -->
                                        <input type="email" placeholder="手机号或邮箱" class="form-control">
                                    </div>
                                    <div class="form-group">
                                        <!-- <label>密码：</label> -->
                                        <input type="password" placeholder="设置密码" class="form-control">
                                    </div>
                                   
                                    <div class="text-center">
                                        <button class="btn btn-md btn-primary " type="submit"><strong>注册</strong>
                                        </button>
                                       
                                            
                                    </div>
                                    <h6 class="text-center user_agreement">点击 “注册” 即表示您同意并愿意遵守艺格</h6>
                                        <h6 class="text-center "><a href="#">用户协议</a> 和 <a href="#">隐私政策</a> 。</h6>
                                </form>
            </div>
        <div class="tab-pane " id="log-in">
            <form  role="form">
                 <div class="form-group">
                                        <!-- <label>用户名：</label> -->
                     <input name="username" type="email" placeholder="手机号或邮箱" class="form-control">
                 </div>
                 <div class="form-group">
                                        <!-- <label>密码：</label> -->
                     <input name="password" type="password" placeholder="密码" class="form-control">
                 </div>
                <div class="save"><input type="checkbox" class="i-checks">&nbsp;&nbsp;自动登录</strong></label></div>
                 <div class="text-center">
                     <button class="btn btn-md btn-primary " type="submit"><strong>登录</strong></button>             
                 </div>
                 
                 

             </form>
                            
            </div>



        </div>

    </div>
</div>
  • 写回答

2条回答 默认 最新

  • 小蓝阿姨 2022-04-20 21:11
    关注
    

<!DOCTYPE html>
<html>

<head>
  <title>shit</title>
</head>

<body>
  <div class="bady_background"
    style="background:url(images/body_background1.jpg) center 0 no-repeat ;background-size:100%;width:100%;height:100%;">
    <div class="logo">
      <a href="index.html" alt="主页" title="主页"></a>
    </div>
    <div class="container ">
      <ul class="nav nav-pills" role="tablist" id="myTab">
        <li class="active active_now"><a href="#log-in" role="tab" data-toggle="tab"><strong>登录</strong></a></li>
        <li><a class="hover_background" href="#login" role="tab" data-toggle="tab"><strong>注册</strong></a></li>
      </ul>
      <div class="tab-content">
        <div class="tab-pane active" id="login">
          <form role="form">
            <div class="form-group">
              <!-- <label>用户名：</label> -->
              <input type="text" placeholder="你的昵称" class="form-control">
            </div>
            <div class="form-group">
              <!-- <label>用户名：</label> -->
              <input type="email" placeholder="手机号或邮箱" class="form-control">
            </div>
            <div class="form-group">
              <!-- <label>密码：</label> -->
              <input
                type="password"
                placeholder="设置密码"
                class="form-control"
                onchange="verifyPassword(this.value)"
              >
            </div>

            <div class="text-center">
              <button class="btn btn-md btn-primary " type="submit"><strong>注册</strong>
              </button>
            </div>
            <h6 class="text-center user_agreement">点击 “注册” 即表示您同意并愿意遵守艺格</h6>
            <h6 class="text-center "><a href="#">用户协议</a> 和 <a href="#">隐私政策</a> 。</h6>
          </form>
        </div>
        <div class="tab-pane " id="log-in">
          <form role="form">
            <div class="form-group">
              <!-- <label>用户名：</label> -->
              <input name="username" type="email" placeholder="手机号或邮箱" class="form-control">
            </div>
            <div class="form-group">
              <!-- <label>密码：</label> -->
              <input
                name="password"
                type="password"
                placeholder="密码"
                class="form-control"
                onchange="verifyPassword(this.value)"
              >
            </div>
            <div class="save">
              <input type="checkbox" class="i-checks">
              <label><strong>&nbsp;&nbsp;自动登录</strong></label></div>
            <div class="text-center">
              <button class="btn btn-md btn-primary" type="submit">
                <strong>登录</strong>
              </button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</body>
<script>
  const verifyPassword = (value) => {
    if (!value.match(/^(?![^a-zA-Z]+$)(?!\D+$)(?![a-zA-Z0-9]+$).{8,}$/)) {
      alert('密码不符合规范')
    }
  }
</script>
</html>
    评论 编辑记录

报告相同问题？

问题事件

  • 创建了问题 4月20日

悬赏问题

  • ¥100 对反编译和ai熟悉的开发者。
  • ¥15 带序列特征的多输出预测模型
  • ¥15 Python 如何安装 distutils模块
  • ¥15 关于#网络#的问题：网络是从楼上引一根网线下来，接了2台傻瓜交换机，也更换了ip还是不行
  • ¥15 资源泄露软件闪退怎么解决？
  • ¥15 CCF-CSP 2023 第三题 解压缩(50％)
  • ¥30 comfyui openpose报错
  • ¥20 Wpf Datarid单元格闪烁效果的实现
  • ¥15 图像分割、图像边缘提取
  • ¥15 sqlserver执行存储过程报错