发布价值信息
Wordpress、Software、VPN。。

js 操作 cookie 保存信息教程

JS 设置 Cookie:

假设在 A 页面中要保存变量 username 的值(” Tokin “)到 cookie 中,key 值为 name,则相应的 JS 代码为:

document.cookie="name="+username;

JS 读取 Cookie:

假设cookie中存储的内容为:name=Tokin;xxx=xxx;…

则在 B 页面中获取变量 username 的值的 JS 代码如下:

var username=document.cookie.split(";")[0].split("=")[1];

最后,username 就可以取出来了。

既然知道了基本的 Cookie 读写操作,那我们可以把这个操作封装成一系列函数,方便之后的频繁调用。

函数如下:

//写cookies
function setCookie(name,value)
{
   var Days = 30;
   var exp = new Date();
   exp.setTime(exp.getTime() + Days*24*60*60*1000);
   document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
   var strsec = getsec(time);
   var exp = new Date();
   exp.setTime(exp.getTime() + strsec*1);
   document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

//读cookies
function getCookie(name)
{
   var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   if(arr=document.cookie.match(reg)) return (arr[2]);
   else return null;
}

//删cookies
function delCookie(name)
{
   var exp = new Date();
   exp.setTime(exp.getTime() - 1);
   var cval=getCookie(name);
   if(cval!=null) document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}

使用示例

setCookie("name","Tokin"); //写cookie
console.log(getCookie("name")); //读cookie
delCookie("name"); //删cookie
console.log(getCookie("name")); //再次读应该是读不到的

拓展功能

如果需要设定自定义过期时间,那么把上面的 setCookie 函数换成下面两个函数就 ok

//写cookie
function setCookie(name,value,time)
{
   var strsec = getsec(time);
   var exp = new Date();
   exp.setTime(exp.getTime() + strsec*1);
   document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

//设置时间
function getsec(str)
{
  alert(str);
  var str1=str.substring(1,str.length)*1;//获取字母后的数字(这一步也可以过滤字母就获取到数字了)
  var str2=str.substring(0,1);//获取字符串字一个字母
  if (str2=="s") return str1*1000;
  else if (str2=="h") return str1*60*60*1000;
  else if (str2=="d") return str1*24*60*60*1000;
}
//这是有设定过期时间的使用示例:
//s30是代表30秒
//h是指小时,如12小时则是:h12
//d是天数,30天则:d30

setCookie("name","Tokin","h12"); //写入操作,可以设定过期时间了(12小时)

基本的代码就像上面,发挥自己的想象力吧。

赞(0) 打赏本站

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

×
打赏作者
未经允许不得转载:何先生 » js 操作 cookie 保存信息教程
分享到: 更多 (0)

Comments 2

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. 沙发

    很棒啊

    星空游戏
    3
    2年前 (2017-04-07)回复 Google Chrome 21.0.1180.89| Windows 7 x64| IP数据库错误或不存在
  2. 板凳

    你好,请问右下角那个”出售二开主题“的提示框,是怎么弄的,有相关教程吗?貌似可以记住用户的操作啊,点击关闭后,浏览其他页面就不再次弹出,这个非常人性化啊,期待相关教程~ :wink:

    龙笑天
    1
    1年前 (2017-05-28)回复 Firefox 28.0| Windows 7 x64| IP数据库错误或不存在

何先生的博客 专注分享 更优质

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏