HTML页面使用Cookie记住密码功能

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>标题</title>
        <style type="text/css">
        </style>
    </head>

    <body onkeydown="keyLogin()">

            <div class="register-content register-content_j">
                用户名<input id="loginName" type="text" placeholder="请输入用户名">
                密    码<input id="password" type="password" placeholder="请输入密码">
            </div>
            <input id="remember_password" type="checkbox" />记住密码
            <div class="reg-btn" id="login">登 录</div>

        </div>
    </body>

    <script type="text/javascript">

        $(function() {
            getCookie();
        });

        // 回车键登陆
        function keyLogin(){
            if (event.keyCode==13){
                document.getElementById("login").click();
            }
        };

        // 用户名密码登陆
        function login(){

            if($("#loginName").val() == ""){
                alert("请输入用户名");
                return;
            }
            if($("#password").val() == ""){
                alert("请输入密码");
                return;
            }

            $.post("login!login.action",
            {
                "account.loginName" : $("#loginName").val(),
                "account.passwd" : $("#password").val()
            },function(data) {
                saveInfo();
                doLogin(data);
            }, "json");
        }

        // 登陆后跳转
        function doLogin(data){
            if (data != null && data.success) {
                location.href = 'login!doIndex.action';
            } 
            else {
                if(data.message != null && data.message != ""){
                    alert(data.message);
                    doReset();
                }else if(data.msg != null && data.msg != ""){
                    alert(data.msg);
                    doReset();
                }
            }
        }

         // 保存Cookie
        function saveInfo() {
            try {
                 // 保存按键是否选中
                 var isSave = document.getElementById('remember_password').checked;
                 if (isSave) {
                     var username = $("#loginName").val();
                     var password = $("#password").val();
                     if (username != "" && password != "") {
                         SetCookie(username, password);
                     }
                 } else {
                     SetCookie("", "");
                 }

             } catch (e) {}
         }

         // 保存Cookie
         function SetCookie(username, password) {
             var Then = new Date();
             Then.setTime(Then.getTime() + 1866240000000);
             document.cookie += ("username=" + username + "%%" + password + ";expires=" + Then.toGMTString());
         }

        // 获取登陆的用户名和密码
        function getCookie() {
             var nmpsd;
             var nm;
             var psd;
             var cookieString = new String(document.cookie);
             var cookieHeader = "username=";
             var beginPosition = cookieString.indexOf(cookieHeader);
             cookieString = cookieString.substring(beginPosition);
             var ends = cookieString.indexOf(";");
             if (ends != -1) {
                 cookieString = cookieString.substring(0, ends);
             }
             if (beginPosition > -1) {
                 nmpsd = cookieString.substring(cookieHeader.length);
                 if (nmpsd != "") {
                     beginPosition = nmpsd.indexOf("%%");
                     nm = nmpsd.substring(0, beginPosition);
                     psd = nmpsd.substring(beginPosition + 2);
                     $("#loginName").val(nm)
                     $("#password").val(psd)

                     if (nm != "" && psd != "") {
                         document.getElementById('remember_password').checked = true;
                     }
                 }
             }
        }

    </script>
</html>
HTML页面 使用Cookie记住密码功能

猜你喜欢

HTML页面使用Cookie记住密码功能
