Jquery cookie - 切換框

Question

我需要記住單擊框的狀態（如果顯示或隱藏）。我正在使用cookies插件。

當我點擊#clickable h3我想隱藏或顯示#clickable p ...我需要在F5之後隱藏/顯示它（所以它會記住它的狀態）。

在初始加載時，必須隱藏框，但如果沒有Javascript存在，它將始終顯示。
這裏是我的代碼：

$(document).ready(function(){ 
    /* On load show/hide box depending on cookie */ 
    if($.cookie('click_cookie') == true){ 
     $.cookie('click_cookie', true); 
     $("#clickable p").show(); 
    } else { 
     $.cookie('click_cookie', false); 
     $("#clickable p").hide(); 
    } 

    /* When clicked */ 
    $("#clickable h3").click(function(){ 
     /* Animate box */ 
     $("#clickable p").animate({ 
      height: "toggle", 
      opacity: "toggle" 
     }) 
     /* Toggle cookie */ 
     if($.cookie('click_cookie') == true){ 
      $.cookie('click_cookie', false); 
     } else { 
      $.cookie('click_cookie', true); 
     } 
    }); 
}); 

的問題是，按預期這是行不通的。該框始終隱藏在F5之後。 $.cookie('click_cookie') == true將永遠不會評估，所以它將永遠隱藏。

Answer 1

試試這個。 $ .cookie的回報，並設置字符串：

$(function(){ 
    /* On load show/hide box depending on cookie */ 
    $("#clickable p").toggle($.cookie('click_cookie') == "true"); 

    /* When clicked */ 
    $("#clickable h3").click(function(){ 
    /* Animate box */ 
    $("#clickable p").animate({ 
     height: "toggle", 
     opacity: "toggle" 
    }) 
    /* Toggle cookie */ 
    var show = $.cookie('click_cookie') =="true"; // also false if no cookie at all 
    $.cookie('click_cookie',show?"false":"true"); 
    }); 
});