zoukankan      html  css  js  c++  java
  • jquery----用户密码验证

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>作业1</title>
        <link rel="stylesheet" type="text/css" href="bootstrap.min.css">
        <style>
            .container {
                margin-top: 50px;
            }
        </style>
    </head>
    <body>
    <div class="container">
        <div class="row">
            <div class="col-md-4 col-md-offset-4">
                <form action="#"  novalidate>
                    <div class="form-group">
                        <label for="username">用户名</label>
                        <input type="text" class="form-control" id="username" placeholder="username">
                        <span id="helpBlock" class="help-block"></span>
                    </div>
                    <div class="form-group">
                        <label for="Password">密码</label>
                        <input type="password" class="form-control" id="Password" placeholder="Password">
                        <span id="helpBlock2" class="help-block"></span>
                    </div>
                    <button type="submit" class="btn btn-default submit">提交</button>
                </form>
            </div>
        </div>
    </div>
    <script src="jquery.min.js"></script>
    <script src="bootstrap.js"></script>
    <script>
        $(".submit").on("click",function () {
            $("form .form-group").removeClass("has-error");
            $("form span").text("");
            $(":input").each(function () {
                if ($(this).val().length===0){
                    console.log($(this).next().html())
                    console.log($(this).prev()[0].innerHTML)
                    var name =  $(this).prev().text();
                    $(this).parent().addClass("has-error");
                    $(this).next().text(name+"不能为空");
                    return false
                }
            });
        return false
        })
    
    
    </script>
    </body>
    </html>
    

      

  • 相关阅读:
    Flask--配置文件
    Flask--路由系统
    Flask--视图
    Flask--蓝图
    Flask--静态资源
    Flask--登录验证(多个装饰器)
    Flask--session
    CSS中的定位机制
    四、DDL常见操作汇总
    三、管理员必备技能
  • 原文地址:https://www.cnblogs.com/yanxiaoge/p/10574610.html
Copyright © 2011-2022 走看看