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(); }
用js读、写、删除Cookie代码续篇
- Author -
hebedich声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@