jquery cookie 设置 css 显示 : none

Question

我正在使用 jquery cookie 插件，我试图让浏览器在刷新后记住 CSS 的状态，这是单击按钮时的代码:

    $('#cartHolder').attr('style','display: none !important');
    $.cookie("cartDisplay", 'none !important');

然后在我的标题中我有:

   if ($.cookie("cartDisplay")){
       $('#cartHolder').attr('style', $.cookie("cartDisplay"));
   }

问题是，每次刷新后，display 属性仍会重置回其默认属性。然而，在控制台窗口中，我看到 jquery cookie 已成功存储必要的值，只是在每次刷新后没有被写入 DOM。

谁能帮帮我？

谢谢

Answer 1

不应使用 attr('style')，因为它会覆盖您的所有样式。请改用 .css。也请尝试避免 !important。尝试

$('#cartHolder').css('display','none');
$.cookie("cartDisplay", 'none');

在你的标题中。

$(document).ready(function(){
    if ($.cookie("cartDisplay")){
           $('#cartHolder').css('display', $.cookie("cartDisplay"));
       }
});

或者你可以使用.toggle

$('#cartHolder').hide();
$.cookie("cartDisplay", 'false');

在你的标题中。

$(document).ready(function(){
    if ($.cookie("cartDisplay")){
           $('#cartHolder').toggle($.cookie("cartDisplay"));
       }
});

请记住将代码包装在 $(document).ready(function(){ 中以确保 DOM 元素已加载