原文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. Hadoop 3.x 与Hadoop 2.x 的区别和优化点

    Hadoop 3.x 与Hadoop 2.x 的区别和优化点 通用性 1.精简Hadoop内核,包括剔除过期的API和实现,将默认组件实现替换成最高效的实现(比如将FileOutputCommitte ...

  2. akka-grpc - 应用案例

    上期说道:http/2还属于一种不算普及的技术协议,可能目前只适合用于内部系统集成,现在开始大面积介入可能为时尚早.不过有些项目需求不等人,需要使用这项技术,所以研究了一下akka-grpc,写了一篇 ...

  3. JS - 日期时间比较函数

    JS日期比较(yyyy-mm-dd) function duibi(a, b) { var arr = a.split("-"); var starttime = new Date ...

  4. 揭秘 Kubernetes attach/detach controller 逻辑漏洞致使 pod 启动失败

    前言 本文主要通过深入学习k8s attach/detach controller源码,了解现网案例发现的attach/detach controller bug发生的原委,并给出解决方案. 看完本文 ...

  5. 记录学习docker命令的随笔

    docker安装与启动 安装docker yum包更新到最新  sudo yum update 安装需要的软件包  sudo yum install -y yum-utils device-mappe ...

  6. Tornado + vue.js 前后端分离运行脚本

    shell脚本部分: #!/bin/bash 主脚本 (./cem-demo_publish_front) (./cem-demo_publish_backend) #!/bin/bash 后端脚本 ...

  7. Android开发，java开发程序员常见面试题，求100-200之间的质数，java逻辑代码

    public class aa{ public static void main (String args []){ //author:qq986945193 for (int i = 100;i&l ...

  8. 构造清华大学的yum源

    [root@localhost ~]# cd /etc/yum.repos.d/ [root@localhost yum.repos.d]# vim qinghua.repo [qinghua] na ...

  9. tp5下的文件上传与下载类

    class FieldInterfun extends Controller { /** * [upload 上传文件] * @param [type] $file [description] * @ ...

  10. My Github Repository

    最近在Github上整了个Repository来保存打过的比赛的代码,包括Codeforces,Google Code Jam和Google Kick Start等,之后应该也会搞一点刷题的代码. 之 ...