jQuery实现记住帐号密码功能
记住密码是每个有帐号登录的网站必备的，现在说一下通过COOKIE实现的记住密码功能。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>COOKIE</title>
</head>
<body>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>
<script type="text/javascript">
//读取cookie
var user = $.cookie('uu');
var pwd = $.cookie('pp');
$(document).ready(function(){
// 判断是否存在cookie
if (user) {
$("input:text").val(user);
$("input:password").val(pwd);
$("#che").html("<input type=\"checkbox\" onclick=\"uncheck()\" id=\"check1\" checked/>");
}
});
// 选中记住密码
function check(){
$("#che").html("<input type=\"checkbox\" onclick=\"uncheck()\" id=\"check1\"/>");
// 设置为选中状态
document.getElementById("check1").checked=true;
// 创建一个cookie并设置有效时间为 7天
$.cookie('uu', $("input:text").val(), { expires: 7 });
$.cookie('pp', $("input:password").val(), { expires: 7 });
}
// 取消记住密码
function uncheck(){
$("#che").html("<input type=\"checkbox\" onclick=\"check()\" id=\"check1\"/>");
// 设置为取消状态
document.getElementById("check1").checked=false;
// 删除cookie
$.cookie('uu','');
$.cookie('pp','');
}
</script>
<input type="text" name="username" placeholder="帐号"><br/>
<input type="password" name="password" placeholder="密码"><br/>
记住密码：<div id="che"><input type="checkbox" onclick="check()" id="check1"/></div><br/>
</body>
</html>
只要在表单输入帐号密码，再勾选记住密码，那么你的帐号密码就已经被存入到cookie了，有效期7天。然后你刷新页面，发现帐号密码还在表单中，不会被清空。
demo：
http://likeyunba.com/m/Login-...
作者：TANKING
web：http://likeyunba.com
时间：2019-03-09
相关推荐
houmenghu 2020-11-17
kentrl 2020-11-10
jincheng 2020-09-01
Blueberry 2020-08-15
xclxcl 2020-08-03
zmzmmf 2020-08-03
阳光之吻 2020-08-03
PkJY 2020-07-08
hzyuhz 2020-07-04
89407707 2020-06-27
服务器端攻城师 2020-06-26
阳光岛主 2020-06-25
笨重的蜗牛 2020-06-20
xuanwenchao 2020-06-14
Lophole 2020-06-13
明瞳 2020-06-12
songerxing 2020-06-11