JQuery - 使用 Cookie 记住切换状态

Question

我有以下 JQuery 来切换页面上的标题。如何使用 JQuery Cookie 记住切换状态？

$(document).ready(function() {
    $('#btnToggleHeader').click(function() {
    $('#Header').slideToggle('slow');
    });
});

非常感谢!

Answer 1

关于 javascript 和 cookie 的一个很好的资源是 http://www.w3schools.com/JS/js_cookies.asp .

基于该网站，我们获得了 3 个函数:setCookie、getCookie 和 checkCookie(它为我们演示了如何使用其他两个函数。)

要设置切换的初始状态，可以这样操作:

$(document).ready(function(){
// The initial load event will try and pull the cookie to see if the toggle is "open"
var openToggle = getCookie("open") || false;
if ( openToggle )
    $("#Header").show();
else
    $("#Header").hide();

// The click handler will decide whether the toggle should "show"/"hide" and set the cookie.
$('#btnToggleHeader').click(function() {
    var closed = $("#Header").is(":hidden");
    if ( closed )
       $("#Header").show();
    else
        $("#Header").hide();
    setCookie("open", !closed, 365 );
});

});

注意:这只是一个引用，我没有时间测试。希望对您有所帮助。