0

如何使用 jquery 设置 cookie 以记住哪个 div 被切换并在页面刷新时保持切换?

我已经尝试了很多解决方案并且几乎已经弄清楚了,但是在设置和检索 cookie 时我遇到了困难。

My HTML:
<a href="javascript:showonlyone('newboxes2');" >Login</a>
<a href="javascript:showonlyone('newboxes3');" >Register</a>

<div class="newboxes" id="newboxes1" style="display: block">
   default text to be shown when no cookies are set
</div>

<div class="newboxes" id="newboxes2" style="display: none">
login form
</div>

<div class="newboxes" id="newboxes3" style="display: none"> 
register form       
</div>  

我的脚本:

/************jQuery Cookie**************/
;(function(g){g.cookie=function(h,b,a){if(1<arguments.length&&(!/Object/.test(Object.prototype.toString.call(b))||null===b||void 0===b)){a=g.extend({},a);
if(null===b||void 0===b)a.expires=-1;
if("number"===typeof a.expires){var d=a.expires,c=a.expires=new Date;
c.setDate(c.getDate()+d)}b=""+b;
return document.cookie=[encodeURIComponent(h),"=",a.raw?b:encodeURIComponent(b),a.expires?";
expires="+a.expires.toUTCString():"",a.path?";
path="+a.path:"",a.domain?";
domain="+a.domain:"",a.secure?";
secure":
""].join("")}for(var a=b||{},d=a.raw?function(a){return a}:decodeURIComponent,c=document.cookie.split("; "),e=0,f;f=c[e]&&c[e].split("=");
e++)if(d(f[0])===h)return d(f[1]||"");
return null}})(jQuery);

if ($.cookie('showDiv') == 'newboxes2'){
 newboxes2.show();
}

if ($.cookie('showDiv') == 'newboxes3'){
 newboxes3.show();
}

function showonlyone(thechosenone) {
$('.newboxes').each(function(index) {
    if ($(this).attr("id") == thechosenone) {
         $(this).show(200);
         $.cookie('showDiv', thechosenone);
    }
    else {
         $(this).hide(600);
    }
});
}

如果 cookie 代码格式不正确,这里有一个工作示例:http: //jsfiddle.net/CQFJ4/但是那个小提琴不能满足我的需要,我只是借用了 cookie 代码。

我遇到困难的地方是使用 $(this) 在每个循环中设置 cookie, 然后在刷新页面时调用该 cookie 感谢您的帮助,我非常感谢!

4

1 回答 1

1

如果你放入this一个字符串,它不会被解释为一个标识符,它只是这四个字符。您需要将元素中的 id 连接到字符串中,因此这将适用于您当前的代码:

$.cookie($(this).attr('id') + '.showDiv', 'visible');

但是,每个请求中的每个 cookie 值都会在服务器和浏览器之间来回发送,并且域允许 cookie 的空间限制为几千字节,因此您应该使 cookie 尽可能小。使用单个 cookie 并将可见元素的标识放在值中:

$.cookie('showDiv', thechosenone);

然后在显示元素时检查值:

if ($.cookie('showDiv') == 'newboxes2'){
  newboxes2.show();
}
于 2013-08-18T19:15:37.280 回答