原文https://blog.csdn.net/qq_29663071/article/details/73826642

https://www.cnblogs.com/webcome/p/5470975.html

<!DOCTYPE html>
<html lang="en">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="/css/bootstrap.min.css">
</head>
<body>

<div class="container">
<div class="row" style="margin-top: 200px">
<div class="col-sm-6 col-lg-offset-2">
<form method="post" class="form-horizontal">
<div class="form-group">
<label for="account" class="col-sm-2 control-label">账户</label>
<div class="col-sm-10">
<input id="account" name="account" class="form-control" th:placeholder="请输入账户"></input>
</div>
</div>
<div class="form-group">
<label for="password" class="col-sm-2 control-label">密码</label>
<div class="col-sm-10">
<input id="password" type="text" name="password" th:placeholder="请输入密码" class="form-control">
</div>
</div>

<div class="form-group">
<div class="col-sm-10 col-lg-offset-2">
<div class="checkbox">
<label>
<input type="checkbox" id="checkbox">请记住我
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-3 col-lg-offset-5">
<input id="button" type="button" class="form-control btn btn-primary" value="登录">
</div>
</div>
</form>
</div>
</div>
</div>

<script src="/js/bootstrap.min.js"></script>
<script src="/js/jquery.js"></script>
<script src="/js/jquery.cookie.js"></script>
<script>
if ($.cookie('checkbox')=="true") {
var checkflg = true;
$("#checkbox").attr("checked", true);
$("#account").val($.cookie("account"));
$("#password").val($.cookie("password"));
}else{
// 默认不记住
var checkflg = false;
}
$("#checkbox").click(function () {
if (!checkflg){
$("#checkbox").attr("checked",true);
}else{
$("#checkbox").attr("checked",false);
}
checkflg = !checkflg;
});
function setCookie() {
if (checkflg) {         
  var account = $("#account").val();
var password = $("#password").val();
     $.cookie("checkbox", "true", { expires: 7 });
  $.cookie("account", account, { expires: 7 });
$.cookie("password", password, { expires: 7 });
} else {
$.cookie("checkbox", "false", { expires: -1 });
$.cookie("account", '', { expires: -1 });
$.cookie("password", '', { expires: -1 });
}
}
$("#button").click(function () {
setCookie();
window.location.href="/login/loginValidate?account="+$("#account").val()+"&password="+$("#password").val();
});
</script>
</body>
</html>

本地保存cookie的更多相关文章

  1. Scrapy框架--cookie的获取/传递/本地保存

    环境:Python3.6 + Scrapy1.4 我要实现的东西:1. 完成模拟登陆         2. 登陆成功后提取出cookie,然后保存到本地cookie.txt文件中         3. ...

  2. Python3 使用selenium库登陆知乎并保存cookie为本地文件

    Python3 使用selenium库登陆知乎并保存cookie为本地文件 学习使用selenium库模拟登陆知乎,并将cookie保存为本地文件,然后供以后(requests模块)使用,用selen ...

  3. JS本地保存数据的几种方法

    1.Cookie 这个恐怕是最常见也是用得最多的技术了,也是比较古老的技术了.COOKIE优点很多,使用起来很方便 但它的缺点也很多: 比如跨域访问问题:无法保存太大的数据(最大仅为4KB):本地保存 ...

  4. jquery.validate验证表单配合回调提交和h5.storage本地保存笔记

    表单验证插件我使用:jquery.validate.js 支持中文提示,可扩展性强!教程地址 本地保存状态信息使用:h5提供的storage,浏览器支持5m的存储量,存储类型必须是string类型,并 ...

  5. ie 浏览器无法保存cookie,且与域名包括了下划线(_)有关系的问题

    <span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255) ...

  6. 77.JS本地保存数据的几种方法

    1.Cookie 这个恐怕是最常见也是用得最多的技术了,也是比较古老的技术了.COOKIE优点很多,使用起来很方便 但它的缺点也很多: 比如跨域访问问题:无法保存太大的数据(最大仅为4KB):本地保存 ...

  7. H5新特性 本地存储---cookie localStorage sessionStorage

    本地存储的作用 :避免登录网站时,用户在页面浏览时重复登录,也可以实现快速登录,一段时间内保存用户的登录效果,提高页面访问速率 在html5中提供三种数据持久化操作的方法: 1.cookie 可看作是 ...

  8. 本地存储cookie,localStorage,sessionStorage

    常见的前端存储有老朋友 cookie,短暂的 sessionStorage,和简单强大的localStorage 他们之间的区别有以下几点 1.. cookie在浏览器和服务器间来回传递.而sessi ...

  9. 小谢第37问:关于websocket推送进度,本地保存进度条,然后跳出页面进入后再显示的问题

    1.主要技术点:sessionStorage 会话存储进度 这里在使用之前,顺便说一下cookie.sessionStorage.localStorage 共同点:都是保存在浏览器端,且同源的. 区别 ...

随机推荐

  1. IDEA常用快捷键Mac os和Windows对照--用到了就会更新

    之前公司用了一段的MacBookPro,离职后自己入手了一台MacBookPro.但是现在的公司中使用的电脑是古老的win7,两个系统的键盘有些许差别,而且快捷键也略有不同.最近因为疫情影响,在家远程 ...

  2. day38:MySQL数据库之约束&索引&外键&存储引擎

    目录 part1:数据类型 part2:约束 part3:主键索引 PRI &唯一索引 UNI &普通索引 MUL part4:外键:foreign key part5:在外键中设置联 ...

  3. PAT甲级真题 A1025 PAT Ranking

    题目概述:Programming Ability Test (PAT) is organized by the College of Computer Science and Technology o ...

  4. 阿里云体验实验室 教你《搭建Hadoop环境》

    体验平台简介 面向开发者和中小企业打造的一站式.全云端的开发平台,打开浏览器就可以开发.调试.上线,所测即所得,并结合无服务器的模式,重新定义云原生时代的研发工作方法论.旨在降低开发者上手成本和中小企 ...

  5. FileZilla Server FTP服务器失败

    使用Filezilla Server配置FTP服务器https://blog.csdn.net/chuyouyinghe/article/details/78998527 FileZilla Serv ...

  6. C# .NET容器的源码

    这里有List<T>的源码http://referencesource.microsoft.com/#mscorlib/system/collections/generic/list.cs

  7. 最短路径(dijkstra 与 Floyd)

    目录 1. 如何建图? 2. Floyd 3. Dijkstra 1. 如何建图? 要跑最短路,首先要有图 --鲁迅 常用的存储方法有两种,分别是邻接矩阵(用二维数组表示边)和邻接表(模拟链表表示边) ...

  8. php反序列化总结与学习

    基础知识: 1.php类与对象 2.魔术函数 3.序列化方法 类与对象 <?php class test{ public $var = "hello world"; publ ...

  9. google protocol buffer——protobuf的问题及改进一

    这一系列文章主要是对protocol buffer这种编码格式的使用方式.特点.使用技巧进行说明,并在原生protobuf的基础上进行扩展和优化,使得它能更好地为我们服务. 在上一篇文章中,我们完整了 ...

  10. 20190923-05Linux用户组管理命令 000 013

    每个用户都有一个用户组,系统可以对一个用户组中的所有用户进行集中管理.不同Linux 系统对用户组的规定有所不同, 如Linux下的用户属于与它同名的用户组,这个用户组在创建用户时同时创建. 用户组的 ...