原文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. npm修改默认配置

    1.nodejs在program files下面会造成一些项目中的问题,因此nodejs在program files下需要先卸载nodejs 2.安装nodejs到自定义的目录下面,例:D:\node ...

  2. 焦大:SEO重思录(上)收录量和收录率的重新定位

    http://www.wocaoseo.com/thread-198-1-1.html 前一段焦大在seo前线就看到有人问为何我收录量很大但是流量很低呢?有时候几百万的收录量但是流量却只有1000不到 ...

  3. WPF Devexpress ChartControl CrosshairLabel显示内容居右

    源码可加Q群:580749909. 一.解决的问题 ChartControl中希望CrosshairLabel的内容据右 or 自定义 二.实现. 多个显示实例(实例:条形,线形,点等等)下的内容设置 ...

  4. [PyTorch 学习笔记] 3.3 池化层、线性层和激活函数层

    本章代码:https://github.com/zhangxiann/PyTorch_Practice/blob/master/lesson3/nn_layers_others.py 这篇文章主要介绍 ...

  5. ReentrantLock可中断锁和synchronized区别

    ReentrantLock中的lockInterruptibly()方法使得线程可以在被阻塞时响应中断,比如一个线程t1通过lockInterruptibly()方法获取到一个可重入锁,并执行一个长时 ...

  6. e3mall商城的归纳总结3之后台商品节点、认识nginx

    一  后台商品节点 大家都知道后台创建商品的时候需要选择商品的分类,而这个商品的分类就就像一棵树一样,一层包含一层又包含一层.因此这里用的框架是easyUiTree.该分类前端使用的是异步加载模式(指 ...

  7. 利用Python爬虫刷新某网站访问量

    前言:前一段时间看到有博友写了爬虫去刷新博客访问量一篇文章,当时还觉得蛮有意思的,就保存了一下,但是当我昨天准备复现的时候居然发现文章404了.所以本篇文章仅供学习交流,严禁用于商业用途 很多人学习p ...

  8. Codeforces1312D Count the Arrays 组合数学

    题意 给你\(n\)和\(m\),问满足以下条件的数列的个数: 数列长度为\(n\) 数列值域范围为\(\left[1,m\right]\) 数列有且仅有一对相等的数 数列是单峰数列(先严格递增后严格 ...

  9. 小程序开发-使用Loading和Toast提示框

    小程序提示框 Loading提示框使用方式 1. 在wxml中作为组件使用 <loading hidden="{{hidden}}"> 加载中... </load ...

  10. axure rp extension for chrome怎么用

    1)打开文件(原型图)的resources文件夹>chrome文件夹>将文件axure-chrome-extension.crx拉至谷歌浏览器的扩展程序页面,点击确定添加 2)提示出错时, ...