本地存储之cookie

源码可以到GitHub上下载!

JS操作cookies方法 :

  1.cookie若不设置过期时间关闭浏览器后会自动清除数据

  2.存储限制4k

  3.同地址下其他文件也能读取到

    cookie用字符串拼接即可

    cookie后可接

; path=path

      ; domain=domain

      ; secure

 1         /**
 2          * [setCookie 设置cookie]
 3          * @param {[String]} c_name  [起个名,独一无二的名字]
 4          * @param {[String]} c_value [需要存的值]
 5          * @param {[Number]} exdays  [时间/天数,设置保存时间  0时为删除]
 6          */
 7         function setCookie(c_name, c_value, exdays) {
 8             document.cookie = c_name + "=" + encodeURIComponent(c_value) + "; max-age=" + (exdays*60*60*24);// 解决符号转码
 9         }
10 
11         /**
12          * 读取cookies
13          * @param  {[String]} c_name [读取名字]
14          * @return {[String]}        [返回读取cookie的值]
15          */
16         function getCookie(c_name) {
17             var name = c_name + "=";
18             var ca = document.cookie.split(';');
19             for (var i = 0; i < ca.length; i++) {
20                 var c = decodeURIComponent(ca[i].trim());// 解码
21                 if (c.indexOf(name) == 0){
22                     return c.substring(name.length, c.length);
23                 }
24             }
25             return "";
26         }
27 
28         // 使用示例
29         var username = document.getElementById("username"); // 获取input username
30         var userpwd = document.getElementById("userpassword"); // 获取input userpassword
31         var remember = document.getElementById("remember"); // 获取记住账号密码
32 
33         /**
34          * 点击复选框记住 账号、密码、复选框
35          */
36         function rememberValue() {
37             if (remember.checked == true) {
38                 setCookie('user', username.value);// 临时
39                 setCookie('pwd', userpwd.value, 30);
40                 setCookie('remember', remember.checked, 30);
41             } else {
42                 setCookie("user","",0);
43                 setCookie("pwd","",0);
44                 setCookie("remember","",0);
45             }
46         }
47 
48         /**
49          * 页面加载完毕后从cookie里读取值并填入相应的标签内
50          */
51         window.onload = function () {
52             username.value = getCookie("user");
53             userpwd.value = getCookie("pwd");
54             remember.checked = getCookie("remember");
55         }

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 本地多图上传预览

    ProsperLee
  • 本地存储之sessionStorage

      复制链接地址打开网页不会复制seessionStorage内的数据

    ProsperLee
  • 移动端开发H5页面点击按钮后出现闪烁或黑色背景的解决办法

    H5页面在IOS端测试的时候发现,点击按钮会闪动,出现一个黑色的背景一闪而过,影响用户体验。最后通过度娘,找到解决方法: 就是给点击的元素添加一个CSS属性或者...

    ProsperLee
  • MySQL InnoDB 中的锁机制

    数据库本质上是一种共享资源,因此在最大程度提供并发访问性能的同时,仍需要确保每个用户能以一致的方式读取和修改数据。锁机制(Locking)就是解决这类问题的最好...

    用户5546570
  • jquery方法.serializeArray()获取name和value并转为json数组

    蓓蕾心晴
  • 《selenium2 python 自动化测试实战》(12)——跳过验证码登录add_cookie

    用户2149234
  • supervisorctl常用指令

    restart <name> restart <name> <name> restart all

    枇杷李子橙橘柚
  • 搭建行政资源管理系统 项目开发环境

    本次的项目开发采用的是Spring MVC + MyBatis开发模式,并且所有的数据验证都将通过拦截器完成。那么在整个项目的整合过程之中,有部分的操作是可以进...

    爱明依
  • dotnet 设计规范 · 抽象定义

    严格来说,只有一个类被其他的类继承,那么这个类就是基类。在很多时候,基类的定义是提供足够的抽象和通用方法和属性、默认实现。在继承关系中,基类定义在上层抽象和底层...

    林德熙
  • polymer组件化与vm特性

    一、Polymer Polymer是Google在2013年的Google I/O大会上提出了一个新的UI框架。Polymer的实现使用了WebComponen...

    IMWeb前端团队

扫码关注云+社区

领取腾讯云代金券