jQuery实现表单内容判断

HTML代码:

    <div>
        <form action="http://www.baidu.com" method="get" id="login">
            <p>用户:<input type="text" name="username"></p>
            <p>密码:<input type="password" name="password"></p>
            <p>邮箱:<input type="email" name="email"></p>
            <p><input type="submit" value="submit"></p>
        </form>
    </div>

 jQuery代码:

    <script src="static/jquery.js"></script>
    <script>
        $(document).ready(function () {
            $(":submit").click(function () {
                var flag=true;
                $(".err").remove();
                $("input[type='text'],input[type='password'],input[type='email']").each(function () {
                    var v=$(this).val();
                    if(v.length==0){
                        flag=false;
                        var name=$(this).attr("name");
                        $(this).after($("<span class='err'>"+name+"必填</span>"));
                    }
                });
                return flag;
            })
        })
    </script>

 

实现效果:

 

posted @ 2017-04-27 10:33  Vincen_shen  阅读(176)  评论(0)    收藏  举报