用js读、写、删除Cookie代码续篇


Posted in Javascript onDecember 03, 2014

上次的一篇文章:用js读、写、删除Cookie代码分享及详细注释说明,在实践中发现了一些问题:

1.cookie在本地文件上只能在火狐上调试,IE和chrome无效

2.cookie没有设置为永不过期,只考虑了设置一个时间段就过期,显然不太合理。

这次给出的是比较合理的cookie操作代码:

var Cookie = {

    get: function (k) {

        return ((new RegExp(["(?:; )?", k, "=([^;]*);?"].join(""))).test(document.cookie) && RegExp["$1"]) || "";

    },

    set: function (k, v, e, d) {

        var date=new Date(); 

        var expiresDays=e; 

        date.setTime(date.getTime()+expiresDays*24*3600*1000); 

        //如果有设置时间,则在规定时间内使用cookie,否则就是永不过期

        document.cookie=k+"="+v+"; expires="+ (e != '' ? date.toGMTString(): "GMT_String")+";path=/;domain="+ (d||'');

    },

    del: function (k) {

        var date=new Date(); 

        //将date设置为过去的时间

        date.setTime(date.getTime()-10000); 

        document.cookie=k+"=; expires="+date.toGMTString(); 

    }

};

例子演示的是:点击文字展开内容,再次点击隐藏。当内容为隐藏时,下次打开还是隐藏的,当内容为显示时,下次打开还是显示。

<div class="tab">

 <h3 class="tab-header">收缩</h3>

 <div class="tab-con" id="tabCon">

  <p>展开之后可见这里的内容</p>

 </div>

</div>

var btn = document.getElementsByTagName('h3')[0];

btn.addEventListener('click',function(){

 var isClose = this.getAttribute('data-isClose');

 if(isClose == 'close'){

  show();

  Cookie.del('flag');

 }else{

  hide();

  Cookie.set('flag','hide');

 }

});

var tabCon = document.getElementById('tabCon');

function show(){

 tabCon.style.display = 'block';

 btn.setAttribute('data-isClose','open');

 btn.innerHTML = '收缩';

}

function hide(){

 tabCon.style.display = 'none';

 btn.setAttribute('data-isClose','close');

 btn.innerHTML = '展开';

}

var flag = Cookie.get('flag');

if(flag == 'hide'){

 hide();

}
Javascript 相关文章推荐
js通过iframe加载外部网页的实现代码
Apr 05 Javascript
详解Wondows下Node.js使用MongoDB的环境配置
Mar 01 Javascript
原生ajax处理json格式数据的实例代码
Dec 25 Javascript
bootstrap fileinput 插件使用项目总结(经验)
Feb 22 Javascript
jQuery Datatable 多个查询条件自定义提交事件(推荐)
Aug 24 jQuery
react学习笔记之state以及setState的使用
Dec 07 Javascript
vue中Npm run build 根据环境传递参数方法来打包不同域名
Mar 29 Javascript
解决使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js问题
Aug 30 Javascript
vue中进入详情页记住滚动位置的方法(keep-alive)
Sep 21 Javascript
jquery.param()实现数组或对象的序列化方法
Oct 08 jQuery
基于JavaScript实现表格隔行换色
May 08 Javascript
vue+elementui实现点击table中的单元格触发事件--弹框
Jul 18 Javascript
js字符串完全替换函数分享
Dec 03 #Javascript
基于jquery实现等比缩放图片
Dec 03 #Javascript
javascript简单实现图片预加载
Dec 03 #Javascript
3种Jquery限制文本框只能输入数字字母的方法
Dec 03 #Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 #Javascript
javascript中clone对象详解
Dec 03 #Javascript
javascript使用正则表达式检测IP地址
Dec 03 #Javascript
You might like
将数组写入txt文件 var_export
2009/04/21 PHP
腾讯QQ php程序员面试题目整理
2010/06/08 PHP
YII实现分页的方法
2014/07/09 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
php将字符串全部转换成大写或者小写的方法
2015/03/17 PHP
PHP常用设计模式之委托设计模式
2016/02/13 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
基于jQuery实现左右div自适应高度完全相同的代码
2012/08/09 Javascript
js操作table示例(个人心得)
2013/11/29 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
AngularJS入门教程之表格实例详解
2016/07/27 Javascript
深入了解JavaScript的逻辑运算符(与、或)
2016/12/20 Javascript
JS百度地图搜索悬浮窗功能
2017/01/12 Javascript
详解如何在Vue2中实现组件props双向绑定
2017/03/29 Javascript
jQuery实现可兼容IE6的遮罩功能详解
2017/09/19 jQuery
详解Jest结合Vue-test-utils使用的初步实践
2019/06/27 Javascript
解决vue-cli 打包后自定义动画未执行的问题
2019/11/12 Javascript
vue+canvas实现移动端手写签名
2020/05/21 Javascript
[01:27:30]LGD vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/19 DOTA
[41:12]Liquid vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.24
2019/09/10 DOTA
简单介绍Python中的struct模块
2015/04/28 Python
简单谈谈Python流程控制语句
2016/12/04 Python
python并发编程之线程实例解析
2017/12/27 Python
python调用c++传递数组的实例
2019/02/13 Python
python使用adbapi实现MySQL数据库的异步存储
2019/03/19 Python
Python实现的删除重复文件或图片功能示例【去重】
2019/04/23 Python
连接pandas以及数组转pandas的方法
2019/06/28 Python
详解利用python+opencv识别图片中的圆形(霍夫变换)
2019/07/01 Python
python爬虫豆瓣网的模拟登录实现
2019/08/21 Python
使用Python获取爱奇艺电视剧弹幕数据的示例代码
2021/01/12 Python
阿根廷票务网站:StubHub阿根廷
2018/04/13 全球购物
Myprotein瑞士官方网站:运动营养和健身网上商店
2019/09/25 全球购物
《最大的“书”》教学反思
2014/02/14 职场文书
2014年信访工作总结
2014/11/17 职场文书
单身申明具结书
2015/02/26 职场文书
毕业论文致谢格式模板
2015/05/14 职场文书