jquery - Jquery Toggle按钮和状态关闭

Question

我有一个可以切换页脚的按钮。当前代码从页脚关闭开始。我的问题是如何使它打开默认状态？我尝试了几种配置，但不确定哪种配置正确。当我检查浏览器上的 cookie 时，默认状态是“隐藏”。

// Toggle Button

$(document).ready(function() {
var button = $('.toggle');

//check the cookie when the page loads
if ($.cookie('currentToggle') ==='visible') {
    togglePanel(button, false);
}
    else {
     togglePanel(button, true);

}

//handle the clicking of the show/hide toggle button
button.click(function() {
    //toggle the panel as required, base on current state
    if (button.text() === "-") {
        togglePanel($(this), true);
    }
    else {
        togglePanel($(this), false);

    }
});

});

function togglePanel(button, show) {

var panel = $('footer');

if (show) {
    panel.slideUp('slow');
    button.text('+');
    $.cookie('currentToggle', 'hidden', { path: '/' });

}
else {
    panel.slideDown('slow');
    button.text('-');
    $.cookie('currentToggle', 'visible', { path: '/' });

}
}

Answer 1

我认为您只需要这一行来处理没有设置 cookie 的情况：

if (!$.cookie('currentToggle'))
    $.cookie('currentToggle', 'visible');

把它放在前面//check the cookie when the page loads

或者，更简单的是，在您检查时反转您的逻辑：

if ($.cookie('currentToggle') === 'hidden') {
    togglePanel(button, true);
} else {
    togglePanel(button, false);
}