jQuery实现记住帐号密码功能

33次阅读

共计 1392 个字符，预计需要花费 4 分钟才能阅读完成。

记住密码是每个有帐号登录的网站必备的，现在说一下通过 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>

</body>
</html>

只要在表单输入帐号密码，再勾选记住密码，那么你的帐号密码就已经被存入到 cookie 了，有效期 7 天。然后你刷新页面，发现帐号密码还在表单中，不会被清空。
demo：
http://likeyunba.com/m/Login-…
作者：TANKINGweb：http://likeyunba.com 时间：2019-03-09

正文完