jquery和cookie状态

时间:2011-01-16 06:15:28

标签: jquery toggle setcookie

我正在尝试做的是有一个侧边栏切换打开和关闭哪个工作正常但我也希望cookie在浏览网站时记住侧边栏状态并返回到页面上

即:如果关闭,如果打开则关闭:

$(document).ready(function($) {
 $('a#side').click(function(){
  $('#sidebar').toggle();
$('a#side').text($(this).text() == 'Show' ? 'Hide' : 'Show');
  $.cookie('side_cookie', 'value');
 return false;
});
if($.cookie('side_cookie')) { 
$('#sidebar').hide(); 
   } else {
$('#sidebar').show();
   }
});

上面的当前代码只会记住它是否已关闭并保持关闭直到会话结束,因此每次返回页面时都必须将其打开...

我可以在vbulletin.com/forum/上看到我试图实现的一个例子,如果你关闭他们的侧边栏然后浏览论坛,当你回到主页仍然关闭时,反之亦然。

感谢任何帮助

3 个答案:

答案 0 :(得分:0)

我认为问题在于if if if($。cookie('side_cookie'))。 试试这个:

$(document).ready(function($) {
 $('a#side').click(function(){
  $('#sidebar').toggle();
$('a#side').text($(this).text() == 'Show' ? 'Hide' : 'Show');
  $.cookie('side_cookie', $(this).text());
 return false;
});
if($.cookie('side_cookie')=='Hide') { 
$('#sidebar').hide(); 
   } else {
$('#sidebar').show();
   }
});

答案 1 :(得分:0)

你必须检查cookie的值而不是它的存在。此外,您将cookie的值硬编码为value。将其更改为showhide

// when it is shown
$.cookie('side_cookie', 'show');

// when it is hidden

$.cookie('side_cookie', 'hide');

并检查cookie的值

if($.cookie('side_cookie') === "show") {
    // code for showing side bar
}
else {
    // code for hiding the side bar
}

答案 2 :(得分:0)

好的,但是我把它排序了,它有很多代码然后我想要它的很多.show()/。hide()而不是.toggle()但是它现在可以用来做软件:

$('a#hide').click(function(){
  $('a#hide,#sidebar').hide();
  $('a#show').show();
  $.cookie('side_cookie_hidden', 'hidden');
  $.cookie('side_cookie_show', null);
 return false;
});

$('a#show').click(function(){
  $('a#show').hide();
  $('a#hide,#sidebar').show();
  $.cookie('side_cookie_show', 'show');
  $.cookie('side_cookie_hidden', null);
 return false;
});

if($.cookie('side_cookie_hidden')) { 
$('a#show').show();
$('a#hide,#sidebar').hide(); 
   } else {
$('a#show').hide();
$('a#hide,#sidebar').show(); 
}