//登陆首页
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
账号:<input type="text" id="userId"/><br />
密码: <input type="text" id="userPwd"/><br/>
<input type="button" value="登陆" id="btn" />
<input type="checkbox" id="ched" />自动登陆
</body>
</html>
<script>
window.onload=function(){
let strcookie=document.cookie;
let arrcookie=strcookie.split("; ");
for(let i=0;i<arrcookie.length;i++){
let arrcook=arrcookie[i].split("=");
if(arrcook[0]==""){
location.href = "6.html";
}else{
location.href ="5.html";
}
}
}
let oId=document.getElementById("userId");
let oPwd=document.getElementById("userPwd");
let oBtn=document.getElementById("btn");
let oChed=document.getElementById("ched");
oBtn.onclick=function(){
//判断是否选中自动登陆
if(oChed.checked){
//获取当前时间
let date=new Date();
//改变Date对象的日期setDate, 返回日期getDate()
date.setDate(date.getDate()+7);
//设置有效时间name=xxx;expires=xxx,expires:有效期
document.cookie="Id="+oId.value+";expires="+date;
document.cookie="Pwd="+oPwd.value+";expires="+date;
location.href = "5.html";
}else{
document.cookie="Id="+oId.value;
document.cookie="Pwd="+oPwd.value;
location.href = "5.html";
}
}
</script>
//登陆成功之后的跳转页面---》5.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p ><span id="spa"></span>你好</p>
<input type="button" value="切换其他账号登陆" id="btn"/>
</body>
</html>
<script>
let ospa=document.getElementById("spa");
let cookieName=null;
let cookiePwd=null;
//获取当前浏览器中存在的cookie
let strcookie=document.cookie;
let arrcookie=strcookie.split("; ");
for(let i=0;i<arrcookie.length;i++){
let arrcook=arrcookie[i].split("=");
if(arrcook[0]=="Id"){
//将已存在的cookie的id值付给body里面的span
ospa.innerHTML=arrcook[1];
}
}
//删除cookie,将cookie里面的键值对设置为"";
let obtn=document.getElementById("btn");
obtn.onclick=function(){
document.cookie="Id=''";
document.cookie="Pwd=''";
location.href = "6.html";
}
</script>
//切换账号 —>6.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
账号:<input type="text" id="userId"/><br />
密码: <input type="text" id="userPwd"/><br/>
<input type="button" value="登陆" id="btn" />
<input type="checkbox" id="ched" />自动登陆
</body>
</html>
<script>
let oId=document.getElementById("userId");
let oPwd=document.getElementById("userPwd");
let oBtn=document.getElementById("btn");
let oChed=document.getElementById("ched");
oBtn.onclick=function(){
//判断是否选中自动登陆
if(oChed.checked){
//获取当前时间
let date=new Date();
//改变Date对象的日期setDate, 返回日期getDate()
date.setDate(date.getDate()+7);
//设置有效时间name=xxx;expires=xxx
document.cookie="Id="+oId.value+";expires="+date;
document.cookie="Pwd="+oPwd.value+";expires="+date;
location.href = "5.html";
}else{
document.cookie="Id="+oId.value;
document.cookie="Pwd="+oPwd.value;
location.href = "5.html";
}
}
</script>