Question

我有fiddle

<h2>TITLE INFO</h2>

<div>text 1</div>
<div>text 2</div>
<div>text 3</div>




jQuery('h2').toggle(function () {
    jQuery('body').addClass('order_list');
    $.cookie('info_type', 'order_list', {
        expires: 30
    });
}, function () {
    jQuery('body').removeClass('order_list');
    $.cookie('info_type', null);
});

var order_list_var = $.cookie('info_type');
jQuery('body').addClass(order_list_var);

如果cookie设置并且我重新加载页面，那么尝试点击h2：没有任何反应只有当我第二次点击时，才会删除cookie和类

Answer 1

您可以使用toggle，而不是使用click。像这样：

jQuery('h2').click(function(){
    if (jQuery('body').hasClass('order_list')){
        jQuery('body').removeClass('order_list');
        $.cookie('info_type', null);
    }
    else{
        jQuery('body').addClass('order_list');
        $.cookie('info_type', 'order_list', {
            expires: 30
        });
    }
});

您遇到的问题是：当您重新加载页面并单击h2时，它始终执行toggle的第一个函数，而不管h2的当前状态如何。使用这样的click，您可以完全控制h2

的状态

重新加载页面后如何修复切换首次单击

1 个答案: