在页面重新加载时保存菜单状态



>我有一个菜单,我希望在页面重新加载并且用户单击关闭或打开时保持打开/关闭状态。

正在使用 cookie 插件,我几乎在那里,但我在设置关闭 cookie 以记住关闭状态时遇到问题,打开的 cookie 仍然存在。

$(document).ready(function() {
// Open / Close Panel According to Cookie //
if ($.cookie('filtermenu') === 'open'){
    $('.filter').show(); // Show on Page Load / Refresh without Animation
}
else {
}
 if ($.cookie('filtermenu') === 'close' || $.cookie('filtermenu') === null){
    $('.filter').hide(); // Show on Page Load / Refresh without Animation
}
else {
}

// Toggle Panel and Set Cookie //
$('#filter-menu').click(function(){
    $('.filter').slideToggle('fast', function(){
        if ($('#filter-menu').is(':hidden')) {
            $.cookie('filtermenu', 'close', { expires: 30 });
        } else {
            $.cookie('filtermenu', 'open');
        }
    });
    return false;
});
});

任何人都可以看看我做错了什么。

谢谢。

更新:抱歉,现在我有了这个,但它仍然没有保持关闭状态,我是否错误地使用了日期对象?

Ok, so now I have this, but the menu still doesn't stay closed.
$(document).ready(function() {
// Open / Close Panel According to Cookie //
if ($.cookie('filtermenu') === 'open'){
    $('.filter').show(); // Show on Page Load / Refresh without Animation
}
else {
}
 if ($.cookie('filtermenu') === 'close' || $.cookie('filtermenu') === null){
    $('.filter').hide(); // Show on Page Load / Refresh without Animation
}
else {
}

// Toggle Panel and Set Cookie //
$('#filter-menu').click(function(){
    $('.filter').slideToggle('fast', function(){

var now = new Date();
var time = now.getTime();
time -= 60 * 1000;
now.setTime(time);
 $.cookie('filtermenu', 'open', {expires: now});
        if ($('#filter-menu').is(':hidden')) {
            $.cookie('filtermenu', 'close', { expires: 30 });
        } else {
            $.cookie('filtermenu', 'open');
        }
    });
    return false;
});
});  

在设置关闭 Cookie 之前,您需要重新设置过期日期早于当前时间的打开 Cookie。这样,打开的 Cookie 将立即过期,而您关闭的 Cookie 将保持不变。

更新 - 获取时间

您已经询问了在JS中获取当前时间的信息,这里有一些示例代码:

var now = new Date();
var time = now.getTime();
time -= 60 * 1000;
now.setTime(time);

这将创建一个名为 now 的新Date对象,并使用 getTime() 从中提取时间。然后我们减去一分钟的时间(时间以毫秒为单位,所以 60 * 1000),然后将日期设置回该时间。您现在可以使用此日期对象来设置 cookie 的过期时间!

最新更新