前些时候一直用cookie等来进行登录页面记住面膜操作，但是由于其存储容量小等缘故，所以后来转向local storage，原理为：当用户勾选记住密码时，local storage 存储用户名密码同时存储记住密码checked,反之则为空；以下为我关于记住密码操作的代码分享
html部分
</head>
<body >
<div class="container1">
<div class="login">
<img src="http://123.56.25.169:8099/esmp/img/log.png" alt=""/>
</div>
</div>
<div id="middle">
<div class="main">
<div class="loginin rt" style="position: relative">
<div class="header">
<img src="http://123.56.25.169:8099/esmp/img/tip.png" alt=""/>
</div>
<div class="mainsection form-group">
<div style=" 246px;height: 46px; margin-bottom: 18px">
<b class="lf markk"></b>
<input class="lf username" type="text" placeholder="用户名"
id="user" autofocus/>
</div>
<div style=" 246px;height: 46px;">
<b class="lf markk markk1"></b>
<input class="lf username" type="password" placeholder="密码" autofocus id="password"/>
</div>
</div>
<div class="pw">
<div class="loadingstatus lf">
</div>
<div class="rt" style="font-size: 12px;color: #707070;line-height: 26px;">
<input type="checkbox" class="lf" id="autoLogin"/>
<span class="rem">
自动登录
</span>
</div>
</div>
<div class="footersection" style="text-align: center">
<button id="btn1">登 录</button>
<div class="registerhtml">
<span class="lf">没有账号？</span>
<a href="http://123.56.25.169:8099/esmp/register.html" class="lf">免费注册</a>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
js部分
//记住密码
if($('#autoLogin').is(':checked')) {
localStorage.setItem('username', username);
localStorage.setItem('password', password);
}else{
localStorage.setItem('username', "");
localStorage.setItem('password', "");
}
//记住密码end
//用户名密码value获取
$("#user").val(localStorage.getItem('username'));
$("#password").val(localStorage.getItem('password'));
if(localStorage.getItem('username')==""){
$("#autoLogin").attr("checked",false)
}else{
$("#autoLogin").attr("checked",true)
}
//用户名密码value获取end