jquery实现记住密码功能

来源:互联网 发布:淘宝上好的实体娃娃店 编辑:程序博客网 时间:2024/05/19 02:39

js代码:

<script type="text/javascript" src="js/jquery-1.7.2.min.js" ></script><script type="text/javascript" src="js/jquery.cookie.js"></script><script type="text/javascript">$(function(){if($.cookie("login")=="true"){$("#username").val($.cookie("username"));$("#password").val($.cookie("password"));$("#checkbox1").prop("checked",true);}$("#submit").click(function(){if(check()){save();alert("以保存");login();}});});function save(){if($("#checkbox1").get(0).checked){var username = $("#username").val();var password = $("#password").val();$.cookie("login","true",{expire:7});$.cookie("username",username,{expires:7});$.cookie("password",password,{expires:7});}else{$.cookie("login","false",{expire:-1});$.cookie("username","",{expires:-1});$.cookie("password","",{expires:-1});}};function check(){var username = $("#username").val();var password = $("#password").val();if(username==""){alert("请输入用户名");$("#username").focus();return false;}if(password==""){alert("请输入密码");$("#password").focus();return false;}return true;}function login(){$.ajax({type:"post",url:"",data:{},datatype:"json",async:true,success:function(data){if(data.success){save();alert("cookie")}}});}</script>

前端代码:

<div class="container" style="margin-top: 10px;">            <div class="row">                <div class="col-md-offset-3 col-md-6">                    <form class="form-horizontal">                        <span class="heading">用户登录</span>                        <div class="form-group">                            <input type="text" class="form-control" id="username" placeholder="用户名">                            <i class="fa fa-user"></i>                        </div>                        <div class="form-group help">                            <input type="password" class="form-control" id="password" placeholder="密 码">                            <i class="fa fa-lock"></i>                            <a href="#" class="fa fa-question-circle"></a>                        </div>                        <div class="form-group">                            <div class="main-checkbox">                                <input type="checkbox" value="None" id="checkbox1" name="check"/>                                <label for="checkbox1"></label>                            </div>                            <span class="text">Remember me</span>                            <button type="submit" class="btn btn-default" id="submit">登录</button>                            <button type="reset" class="btn btn-default" style="margin-right: 20px;">重置</button>                                                    </div>                    </form>                </div>            </div>        </div>


原创粉丝点击