jQuery，slideToggle - 添加Cookies以记住状态

Question

如何在此代码中添加Cookie以记住刷新后的状态？

的jQuery：

$("li.FOLDER A").click(function() { 
    $(this).parent().find("UL:first").slideToggle("fast"); 
    if($(this).parent().attr('className') == "FOLDER") return false; 
}); 

HTML：

<ul> 
<li class="FOLDER"><a href="#"> open folder </a> 
    <ul> 
    <li>...</li> 
    <li>...</li> 
    <li>...</li> 
    </ul> 
</li> 
<li class="FOLDER"><a href="#"> open folder </a> 
    <ul> 
    <li>...</li> 
    <li>...</li> 
    <li>...</li> 
    </ul> 
</li> 
</ul> 

Answer 1

也许你可以使用本地存储，而不是（这是不传输到服务器）

localStorage.setItem('isOpen', true); 

var isOpen = localStorage.getItem('isOpen'); 

，但我不很明白以及你的功能如何工作。
也许这样的事情...

$("li.FOLDER A").click(function() { 
    var isOpen = localStorage.getItem('isOpen'); 
    if(isOpen){ 
     $(this).parent().find("UL:first").slideUp("fast", function(){ 
      localStorage.setItem('isOpen', false); 
     }); 

    } 
    else{ 
     $(this).parent().find("UL:first").slideDown("fast", function(){ 
      localStorage.setItem('isOpen', true); 
     }); 

    } 
    if($(this).parent().attr('className') == "FOLDER") return false; 
}) 
.trigger('click'); 

Answer 2

看看这个插件：https://github.com/carhartl/jquery-cookie

您可能需要使用$.slideDown()和$.slideUp()这样你就可以区分是否要打开或关闭元素

当您打开抽屉：

$.cookie('drawer_state', 'open'); 

当你关上抽屉：

$.cookie('drawer_state', 'close'); 

然后读取抽屉状态时，你的文档加载：

$(document).ready(function(){ 
    if($.cookie('drawer_state') == "open"){ 
     $("#drawer").slideUp(); 
    }else{ 
     $("#drawer").slideDown(); 
    } 
}); 

HTML：

<ul> 
<li class="FOLDER"><a href="#"> open folder </a> 
    <ul id="drawer"> 
    <li>...</li> 
    <li>...</li> 
    <li>...</li> 
    </ul> 
</li> 
</ul>