用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 相关文章推荐
在javascript将NodeList作为Array数组处理的方法
Jul 09 Javascript
关于jquery append() html时的小问题的解决方法
Dec 16 Javascript
HTML上传控件取消选择
Mar 06 Javascript
深入剖析JavaScript中的枚举功能
Mar 06 Javascript
JavaScript中使用ActiveXObject操作本地文件夹的方法
Mar 28 Javascript
JS实现可直接显示网页代码运行效果的HTML代码预览功能实例
Aug 06 Javascript
jQuery插件支持同一页面被多次调用
Feb 14 Javascript
jQuery toggle 代替方法
Mar 22 Javascript
js实现的下拉框二级联动效果
Apr 30 Javascript
对layui中表单元素的使用详解
Aug 15 Javascript
vue element 中的table动态渲染实现(动态表头)
Nov 21 Javascript
Vue.directive 实现元素scroll逻辑复用
Nov 29 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目录遍历函数opendir用法实例
2014/11/20 PHP
thinkphp使用phpmailer发送邮件的方法
2014/11/24 PHP
PHP使用socket发送HTTP请求的方法
2016/02/14 PHP
PHPExcel中文帮助手册|PHPExcel使用方法(分享)
2017/06/09 PHP
让iframe自适应高度(支持XHTML,支持FF)
2007/07/24 Javascript
JQuery 学习笔记 选择器之四
2009/07/23 Javascript
使用jquery animate创建平滑滚动效果(可以是到顶部、到底部或指定地方)
2014/05/27 Javascript
javascript操纵OGNL标签示例代码
2014/06/16 Javascript
详解JavaScript的变量和数据类型
2015/11/27 Javascript
利用JS实现数字增长
2016/07/28 Javascript
JS之获取样式的简单实现方法(推荐)
2016/09/13 Javascript
javascript容错处理代码(屏蔽js错误)
2017/01/20 Javascript
JavaScript中object和Object的区别(详解)
2017/02/27 Javascript
微信小程序 生命周期函数详解
2017/05/24 Javascript
js 毫秒转天时分秒的实例
2017/11/17 Javascript
vue better scroll 无法滚动的解决方法
2018/06/07 Javascript
vue底部加载更多的实例代码
2018/06/29 Javascript
vue组件定义,全局、局部组件,配合模板及动态组件功能示例
2019/03/19 Javascript
JavaScript计算出两个数的差值
2020/03/19 Javascript
vuex中store存储store.commit和store.dispatch的用法
2020/07/24 Javascript
[03:24]DOTA2超级联赛专访hao 大翻盘就是逆袭
2013/05/24 DOTA
Python用5行代码写一个自定义简单二维码
2018/10/21 Python
pycharm 2019 最新激活方式(pycharm破解、激活)
2020/09/22 Python
查找适用于matplotlib的中文字体名称与实际文件名对应关系的方法
2021/01/05 Python
希尔顿酒店中国网站:Hilton中国
2017/03/11 全球购物
网络安全类面试题
2015/08/01 面试题
大学活动策划书范文
2014/01/10 职场文书
项目建议书格式
2014/03/12 职场文书
模特大赛策划方案
2014/05/28 职场文书
《中国梦我的梦》大学生演讲稿
2014/08/20 职场文书
2014年四风问题自我剖析材料
2014/09/15 职场文书
运动会广播稿50字
2015/08/19 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书
SQL SERVER中常用日期函数的具体使用
2021/04/08 SQL Server
TensorFlow中tf.batch_matmul()的用法
2021/06/02 Python
豆瓣2021评分最高动画剧集-豆瓣评分最高的动画剧集2021
2022/03/18 日漫