您的位置：首页 > 其它

记住密码

2016-06-24 13:57 267 查看 
记住密码，，保存在cookie中，，，，
<style>
<pre name="code" class="html">.loginBg{background: url("../images/loginBg.jpg") no-repeat center/cover;}
.service_login{background: url("../images/loginBoxBg.png") no-repeat center;position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
.loginTextBox{width: 678px;height:308px;position: absolute;left:0;top:0;right:0;bottom:0;margin:auto;}
.loginTextBox .content_top{width: 678px;height:50px;position: absolute;top:-20%;left:50%;margin-left: -349px;text-align: center}
.loginTextBox .content_top img{display: inline-block;vertical-align: middle;}
.loginTextBox .content_top span{display: inline-block;vertical-align: middle;font-size: 24px;color: #fff;}
.loginTextBox .login_lf{width:220px;height:308px;float: left;}
.loginTextBox .login_lf img{display: block}
.loginTextBox .login_lf img.login_lf02{width: 88%;margin: 40px auto 0;}
.loginTextBox .login_rt{width:455px;height:270px;padding:0 58px;float: left;}
.loginTextBox .login_rt .user_login{margin-top: 30px;width: 100%;display: inline-block;}
.loginTextBox .login_rt .user_login span{color:#4e677e;font-size: 22px;float:left;line-height: 24px;}
.loginTextBox .login_rt .user_login span.user_ul{color:#3b95c8;font-size: 18px;float:left;line-height: 18px;margin:6px 0 0 10px;}
.loginTextBox .login_rt .login_input.js_user,.loginTextBox .login_rt .loginTextList{width: 100%;margin-top: 25px;;position: relative;}
.loginTextBox .login_rt .login_input.js_user,.loginTextBox .login_rt .loginTextList i{position:absolute;left:5px;top:11px;z-index: 2;}
.loginTextBox .login_rt .login_input.js_user,.loginTextBox .login_rt .loginTextList .st{border: 1px solid #c9c8c8;
border-radius:2px;text-indent: 30px;display: block;width: 100%;line-height: 46px;height: 46px;font-size:14px;}
.loginTextBox .login_rt .login_btn,.loginTextBox .login_rt .login_count,.loginTextBox .login_rt .login_pwd{
display: inline-block;width:90px;height:35px;line-height: 35px;margin-left: 5px;}
.loginTextBox .login_rt .login_btn a{color:#fff;padding:6px 30px;background: #3e96c9;border-radius: 3px;font-size: 15px;}
.loginTextBox .login_rt .login_count input{vertical-align: middle;margin-left: 10px;}
.loginTextBox .login_rt .login_count input.chec{position: relative;top:-1px;}
.loginTextBox .login_rt .login_count .login_pass,.loginTextBox .login_rt .login_pwd a{color:#667A9D;font-size: 12px;}



</style>
</pre><pre code_snippet_id="1728216" snippet_file_name="blog_20160624_1_4103832" name="code" class="html"><!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>客服管理系统登录</title>
<link rel="stylesheet" href="css/common.css"/>
<link rel="stylesheet" href="css/style.css"/>
</head>
<body class="loginBg">
<div class="service_login">
<div class="loginTextBox">
<div class="content_top">
<img src="images/login_logo.png" alt=""/>
<span>客服管理系统</span>
</div>
<div class="login_lf">
<img class="login_lf02" src="images/login_lf02.png" alt=""/>
</div>
<div class="login_rt">
<form>
<div class="user_login"><span>用户登录</span><span class="user_ul"> UserLogin</span></div>
<div class="loginTextList"><i class="icon iconUserText"></i><input class="st js_userName" maxlength="20" type="text" placeholder="请输入用户名"/></div>
<div class="loginTextList"><i class="icon iconUserPsd"></i><input class="st js_userCode" maxlength="20" type="password" placeholder="密码"/></div>
<div class="loginTextList">
<p class="login_btn"><a href="javascript:;" class="js_loginBtn">登录</a></p>
<p class="login_count"><input class="chec js_userCheck" type="checkbox"/><span class="login_pass">记住账号</span></p>
<p class="login_pwd"><a href="#">忘记密码?</a></p>
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript" src="http://static.ilongyuan.cn/cdn/script/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
var userName = $(".js_userName");
var userCode = $(".js_userCode");
var Days = 15;   //cookie 将被保存多少天
var exp  = new Date();  //获得当前时间
exp.setTime(exp.getTime() + Days*60*60*24*1000);  //换成毫秒
$(".js_loginBtn").click(function(){
if($(".js_userCheck").is(':checked')){//判断是否保存密码
document.cookie ="userName="+userName.val()+";expires=" + exp.toGMTString();
document.cookie ="userCode="+userCode.val()+";expires=" + exp.toGMTString();
}else{
Days = 1;   //cookie 将被保存多少天
exp  = new Date();  //获得当前时间
exp.setTime(exp.getTime() + Days);  //换成毫秒
document.cookie ="userName="+userName.val()+";expires=" + exp.toGMTString();
document.cookie ="userCode="+userCode.val()+";expires=" + exp.toGMTString();
}
});
if(document.cookie.indexOf("userName")>=0){//判断以前是否保存了密码
$(".js_userCheck").prop("checked",true);
var userNameVal = document.cookie.match(new RegExp("(^| )userName=([^;]*)(;|$)"))[2];
var userCodeVal = document.cookie.match(new RegExp("(^| )userCode=([^;]*)(;|$)"))[2];
userName.val(userNameVal);
userCode.val(userCodeVal);
}else{
}
})
</script>
</body>
</html>



                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航