使用JQuery保持切换菜单状态

Question

我的菜单有这个HTML切换按钮:

<a href="#" id="toggle_nav" class="sidebar-toggle" data-toggle="offcanvas" role="button">

如何保存切换状态以在页面加载时重新加载它

我已经开始:

$(document).ready(function() {
    $("#toggle_nav").toggle(function() {

    });
});

但我不知道该用什么来保持状态

Answer 1

就像人们在赞扬中说的那样,你可以使用html 5网络存储.

您有两种类型:
- localStorage - 存储没有过期日期的
数据 - sessionStorage - 存储一个会话的数据

如何设置:
localStorage.setItem("name", "value");

如何获得价值
localStorage.getItem("name");

所以现在你可以做一个简单的检查:

if (localStorage.getItem("toggle") === null) {
    //hide or show menu by default
    //do not forget to set a htlm5 cookie
}else{
   if(localStorage.getItem("toggle") == "yes"){
     //code when menu is visible
   }else{
     //code when menu is hidden
   }
}

更多信息在这里