Javascript 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(); }
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。