Cookie是根据路径来存放cookie的,同一路径下只能存在一个同名的cookie,再次定义回覆盖之前的cookie.
这里只是针对当前jsp实现cookie记住密码,未实现cookie的加密操作。
1. Html 部分
<form name="loginForm">
<input type="text" class="text" name="susernum" placeholder="请输入您的身份证号" id="account" ><br>
<input type="password" name="suserpassword" placeholder="请输入您的密码" id="pwd" >
记住密码:<input type="checkbox" name="remeberMe" id="remeberMe" checked >
<input type="submit" value="提交" οnclick="submitForm()">
</form>
2. javascript部分
// 在加载页面的时候,查看是否存在cookie,如果存在直接赋值
window.οnlοad=function(){
console.log(document.cookie);
var cookies = document.cookie.split(";");
var userid = document.getElementById("account");
var checkbox = document.getElementById("remeberMe");
for(var i in cookies){
var keyvalue = cookies[i].split("=");
if(keyvalue[0]!="user")continue;
var username = keyvalue[1].split(":")[0];
var password = keyvalue[1].split(":")[1];
var pswd = document.getElementById("pwd");
userid.value = username;
pswd.value=password;
}
if(userid.value==""){
checkbox.checked =false;
}
}
// 在提交表单是检查是否需要记住密码
function submitForm(){
var checkbox = document.getElementById("remeberMe");
if(checkbox.checked){
var userid = document.getElementById("account").value;
var pswd = document.getElementById("pwd").value;
// 记住密码
var date = new Date ( ) ;
date . setTime ( date . getTime ( ) + 5 * 24 * 3600 * 1000 ) ;
document.cookie = "user="+(userid+":"+pswd)+"; expires =" + date.toGMTString ();
}else{
document.cookie='user=;expires = '+ -1;
}
loginForm.submit();
}
3. 说明
记住密码默认选中
记住密码选中,会将用户名密码传入cookie中保存,下次会直接将用户名密码输入到表单中
记住密码不选,会将Cookie清空,记住密码块不选中