還記得跨站點的jQuery切換嗎？

Question

我希望能夠通過單擊按鈕來隱藏和取消隱藏冗長的菜單，而我已經能夠做到。 但是我不希望訪問者每次訪問新頁面時都必須隱藏菜單，所以我希望他們的最后一次點擊能被記住。 我無法做到這一點。 任何幫助表示贊賞。 我什至願意采取更好的方法來做到這一點。

我認為可行但不可行的代碼是：

        $(document).ready(function(){
    $("button").click(function(){
        $("div.themenu").toggle(100);
    });
});

$(function(){
       if($.cookie){
           $("#themenu").toggle(!(!!$.cookie("toggle-state")) || $.cookie("toggle-state") === 'true');
    }
    $('#menubutton').on('click', function(){
        $("#themenu").toggle();
        $.cookie("toggle-state", $("#themenu").is(':visible'), {expires: 1, path:'/'}); 
});
});

他們單擊的按鈕的代碼是：

<button id="menubutton" class="myButton">Show / Hide Menu</button>

長菜單顯示如下：

<div class="themenu">Long Long Menu Code</div>

Answer 1

只是為了好玩：這是一種替代解決方案，它不需要Cookie，但可以設置URL參數：

//on page load
if (location.href.match('menu=show'))
  $("#themenu").toggle();

//for every link click, block & redirect with menu=show if menu is visible
$(document.body).on('mousedown', 'a', function(e) {
  e.preventDefault();
  var menuParam = (location.href.match('?') ? '&' : '?') + 'menu=show';
  location.href = $("#themenu").is(':visible') ? this.href + menuParam: this.href;
});

Answer 2

localStorage是存儲這種狀態的好地方。 設置就像localStorage.menu = 'hidden'或localStorage.menu = 'visible'一樣容易，可以使用(localStorage && localStorage.menu==='hidden') 。 使用非常老舊的瀏覽器的人將無法使用該功能，但這只是一小部分用戶。 此設置將在訪問該網站時生效，但只能在同一瀏覽器中進行。 某些瀏覽器在“專用瀏覽”模式下存在問題。 它們有時會使localStorage在修改時引起錯誤。