记住密码是每个有帐号登录的网站必备的，现在说一下通过COOKIE实现的记住密码功能。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>COOKIE</title> </head> <body> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdn.bootcss.com/jquery-cookie/1.4.1/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\" οnclick=\"uncheck()\" id=\"check1\" checked/>"); } }); // 选中记住密码 function check(){ $("#che").html("<input type=\"checkbox\" οnclick=\"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\" οnclick=\"check()\" id=\"check1\"/>"); // 设置为取消状态 document.getElementById("check1").checked=false; // 删除cookie $.cookie('uu',''); $.cookie('pp',''); } </script> <input type="text" placeholder="帐号"><br/> <input type="password" placeholder="密码"><br/> 记住密码：<div><input type="checkbox" οnclick="check()"/></div><br/> </body> </html>
只要在表单输入帐号密码，再勾选记住密码，那么你的帐号密码就已经被存入到cookie了，有效期7天。然后你刷新页面，发现帐号密码还在表单中，不会被清空。
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：测试上述代码运行效果。
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery的cookie操作技巧总结》、《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》