Question

我想设置一个默认使用localstorage的show / hide js脚本。

$(document).ready(function () {
  var sidebarVisible = localStorage.getItem('sidebar') == 'true';
  $('#sidebar').toggle(sidebarVisible);
  $('.bgcontainer_center').toggleClass('clicked', sidebarVisible);

  $("#toggle").click(function () {
    $("#sidebar").toggle("slow", function () {
      localStorage.setItem('sidebar', $('#sidebar').is(':visible'));
    });

    $(".bgcontainer_center").toggleClass('clicked');
  });
});

这是指向它的链接https://jsfiddle.net/eo12xw79/67/

我似乎无法找到默认情况下如何设置它。

Answer 1

没有切换的原因是因为我们第一次访问该网页时浏览器的sidebar中没有localstorage密钥。

有一个非常简单的解决方案，只需检查sidebar中是否存在localstorage密钥，如果不存在，则创建它。

$(document).ready(function () {

    // BEGIN
    if(!localStorage.getItem('sidebar')) {
        localStorage.setItem('sidebar', 'true');
    }
    // END

    var sidebarVisible = localStorage.getItem('sidebar') == 'true';
    $('#sidebar').toggle(sidebarVisible);
    $('.bgcontainer_center').toggleClass('clicked', sidebarVisible);

    $("#toggle").click(function () {
        $("#sidebar").toggle("slow", function () {
            localStorage.setItem('sidebar', $('#sidebar').is(':visible'));
        });

        $(".bgcontainer_center").toggleClass('clicked');
    });
});

编辑：我认为这没用，为什么？因为您将localstorage用于没有真正重要性的单个变量之后，这只是个人意见，这取决于您的需求。

DUPLICATE： How to check whether a Storage item is set?

想要默认设置显示/隐藏脚本

1 个答案: