用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 相关文章推荐
jquery模拟alert的弹窗插件
Jul 31 Javascript
JS和jQuery使用submit方法无法提交表单的原因分析及解决办法
May 17 Javascript
javascript事件模型介绍
May 31 Javascript
BootStrap tooltip提示框使用小结
Oct 26 Javascript
基于jPlayer三分屏的制作方法
Dec 21 Javascript
JavaScript如何一次性展示几万条数据
Mar 30 Javascript
Angular如何引入第三方库的方法详解
Jul 13 Javascript
仿淘宝JSsearch搜索下拉深度用法
Jan 15 Javascript
js经验分享 JavaScript反调试技巧
Mar 10 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
Jul 07 Javascript
如何使用less实现随机下雪动画详解
Jan 02 Javascript
Vue.js样式动态绑定实现小结
Jan 24 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
PHP常用开发函数解析之数组篇[未完结]
2012/07/30 PHP
PHP中CheckBox多选框上传失败的代码写法
2017/02/13 PHP
php微信公众号开发之欢迎老朋友
2018/10/20 PHP
Laravel中如何轻松容易的输出完整的SQL语句
2020/07/26 PHP
JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性
2012/10/11 Javascript
自动刷新网页,自动刷新当前页面,JS调用
2013/06/24 Javascript
javascript单引号和双引号的区别和处理
2014/05/14 Javascript
js中利用cookie实现记住密码功能
2020/08/20 Javascript
JS判断键盘是否按的回车键并触发指定按钮点击操作的方法
2017/02/13 Javascript
nodejs和C语言插入mysql数据库乱码问题的解决方法
2017/04/14 NodeJs
jQuery实现的简单图片轮播效果完整示例
2018/02/08 jQuery
JavaScript常见事件对象与操作实例总结
2019/01/05 Javascript
vue-cli4项目开启eslint保存时自动格式问题
2020/07/13 Javascript
es5 类与es6中class的区别小结
2020/11/09 Javascript
你眼中的Python大牛 应该都有这份书单
2017/10/31 Python
用十张图详解TensorFlow数据读取机制(附代码)
2018/02/06 Python
python使用sqlite3时游标使用方法
2018/03/13 Python
Flask框架WTForm表单用法示例
2018/07/20 Python
12个Python程序员面试必备问题与答案(小结)
2019/06/24 Python
StubHub哥伦比亚:购买和出售您的门票
2016/10/20 全球购物
Wojas罗马尼亚网站:波兰皮鞋品牌
2018/11/01 全球购物
意大利在线大学图书馆:Libreria universitaria
2019/07/16 全球购物
英国豪华装饰照明品牌的在线零售商:Inspyer Lighting
2019/12/10 全球购物
拉夫劳伦爱尔兰官方网站:Ralph Lauren爱尔兰
2020/04/10 全球购物
领导干部培训感言
2014/01/23 职场文书
高二地理教学反思
2014/01/24 职场文书
绿化先进工作者事迹材料
2014/01/30 职场文书
学生会招新策划书
2014/02/14 职场文书
班级学雷锋活动总结
2014/06/26 职场文书
企业标语大全
2014/07/01 职场文书
大学生实习证明范本
2014/09/19 职场文书
六查六看个人剖析材料
2014/10/14 职场文书
2014年党的群众路线学习心得体会
2014/11/05 职场文书
道路交通事故人身损害赔偿协议书
2014/11/19 职场文书
文明礼貌主题班会
2015/08/14 职场文书
Android学习之BottomSheetDialog组件的使用
2022/06/21 Java/Android