用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 相关文章推荐
dotopAlert 提示用户需安装播放器的代码
Sep 17 Javascript
jquery等宽输出文字插件使用介绍
Sep 18 Javascript
jquery队列queue与原生模仿其实现方法分享
Mar 25 Javascript
JS获取网页属性包括宽、高等等
Apr 03 Javascript
如何实现chrome浏览器关闭页面时弹出“确定要离开此面吗?”
Mar 05 Javascript
详解AngularJS中module模块的导入导出
Dec 10 Javascript
AngularJS身份验证的方法
Feb 17 Javascript
全面理解闭包机制
Jul 11 Javascript
微信小程序wx.request实现后台数据交互功能分析
Nov 25 Javascript
JS中的BOM应用
Feb 02 Javascript
Vue发布订阅模式实现过程图解
Apr 30 Javascript
JavaScript 如何在浏览器中使用摄像头
Dec 02 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
实现只能输入数字的input不用replace方法
2013/09/12 Javascript
深入理解javascript中return的作用
2013/12/30 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
2014/05/08 Javascript
jQuery实现的点赞随机数字显示动画效果(附在线演示与demo源码下载)
2015/12/31 Javascript
使用Jasmine和Karma对AngularJS页面程序进行测试
2016/03/05 Javascript
window.open不被拦截的简单实现代码(推荐)
2016/08/04 Javascript
利用nodejs监控文件变化并使用sftp上传到服务器
2017/02/18 NodeJs
详解vue数据渲染出现闪烁问题
2017/06/29 Javascript
Vue封装一个简单轻量的上传文件组件的示例
2018/03/21 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
2018/09/20 jQuery
vue实现弹框遮罩点击其他区域弹框关闭及v-if与v-show的区别介绍
2018/09/29 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
2019/05/08 Javascript
使用JavaScrip模拟实现仿京东搜索框功能
2019/10/16 Javascript
python 写入csv乱码问题解决方法
2016/10/23 Python
深入理解NumPy简明教程---数组3(组合)
2016/12/17 Python
详解python之简单主机批量管理工具
2017/01/27 Python
Python中GIL的使用详解
2018/10/03 Python
python 使用pandas计算累积求和的方法
2019/02/08 Python
python print出共轭复数的方法详解
2019/06/25 Python
pandas的排序和排名的具体使用
2019/07/31 Python
Flask框架学习笔记之路由和反向路由详解【图文与实例】
2019/08/12 Python
Python实现生成密码字典的方法示例
2019/09/02 Python
python打印文件的前几行或最后几行教程
2020/02/13 Python
洲际酒店集团美国官网:IHG美国
2017/11/16 全球购物
美国儿童服装、家具和玩具精品店:Maisonette
2019/11/24 全球购物
毕业生个人的自我评价优秀范文
2013/10/03 职场文书
个人自荐信
2013/12/05 职场文书
中学教师管理制度
2014/01/14 职场文书
酒店个人求职信范文
2014/01/25 职场文书
高中生期中考试失利检讨书
2014/10/23 职场文书
校本培训个人总结
2015/02/28 职场文书
销售员岗位职责范本
2015/04/11 职场文书
通知的写法
2015/04/23 职场文书
会议室使用管理制度
2015/08/06 职场文书
Python max函数中key的用法及原理解析
2021/06/26 Python
用Python爬取英雄联盟的皮肤详细示例
2021/12/06 Python