Question

jQuery

$(document).ready(function() {
    $("a.menu").click(function() {
    $("#mp-menu").show();
    });
});

HTML代码

<a class="icon icon-display" class ="menu" href="#">Test</a>

大家好。上面的代码我用来弹出浏览器侧面的菜单div。我想要的是一旦菜单在点击激活后弹出，即使页面上的另一个链接被点击并转到另一个页面，它也应该停靠在屏幕的一侧。怎么办呢？

Answer 1

打开或关闭菜单时，设置一个指示菜单状态的cookie。在任何页面的页面加载中，检查cookie并设置菜单的状态。

Answer 2

这将使用localStorage来保留菜单的状态，但由于你没有提到导致这种情况发生的原因，它不会处理它的关闭...

$(document).ready(function() {
    $("a.menu").click(function() {
        $("#mp-menu").show();
        localStorage.setItem("show-mp-menu", true);
    });
    if (localStorage.getItem("show-mp-menu")) {
        $("#mp-menu").show();
    }
});

但是你触发关闭或隐藏菜单，它需要做这样的事情......

$("#mp-menu").hide();
localStorage.setItem("show-mp-menu", false);

Answer 3

要执行此操作，您要么使用Iframe，要么异步生成内容。因此，即使您单击内容上的链接，它也只会更改内容而不是整个页面，缺点是URL，但可以使用history.pushState或replaceState修复并操作onload以获取定向访问URL。

如果您确实坚持自己的目标和方式，可以设置跨页面“标记”，以便在不同的页面（如Cookie和会话）中跟踪事件。我建议最好使用cookies。使用jQuery cookie轻松。

    $(document).ready(function() {
        var flag = $.cookie('flag');
        $("a.menu").click(function() {
            // this is for toggling the menu bar
            if( !flag ) {
            // When flag is not set, when button is clicked show menu
                $("#mp-menu").show();
                $.cookie('flag', true);
            } else {
                // otherwise, hide it
                $("#mp-menu").hide();
                $.removeCookie('flag');
            }
        });
        if( flag ) {
            // remove cookie, so it will be set when the button is clicked
            // since menu will only be shown once the flag is not set
            // so it is important to remove it
            $.removeCookie('flag');
            $("a.menu").click();
        }
    });

即使单击某个链接转到另一个页面，也会使菜单保持一次点击

3 个答案: