Question

我有几个html页面都设计相同。有一个侧面菜单栏，当按下一个按钮时它关闭，使它成为一个＆＃34;迷你酒吧＆＃34;如果再次按下按钮的正常尺寸。它完美地运作唯一的问题是当你移动到下一页时它会自动回到＆＃34;完整版本＆＃34;有没有办法在页面之间保持相同的状态，这样如果你在第一页上有迷你栏，当你进入下一页时迷你吧仍然在那里而不是重置？

<body class="pace-done mini-navbar">

<body class="pace-done">

Answer 1

我想说一个可能的解决方案是将其打开/关闭状态添加到cookie变量中，这样，当打开/关闭新页面时，值将被保存。

首先得到这个：https://github.com/carhartl/jquery-cookie 并包含在您的文件中，然后，例如，如何使用，到这里：How do I set/unset cookie with jQuery?

然后，一旦你理解了这一切，那么为了给你一个快速的例子，你

（伪代码）（jQuery）

$(document).ready(function(){

   //set cookie here
   $.cookie("IsBoxOpen", "yes"); //meaning yes its open on default

   $('#buttonToCLickHere').on("click", function(){
        if(box is open){
           //then close it with css/js etc but then save its state
           //code to close it visually here, then
           $.cookie("IsBoxOpen", "no"); //meaning now itll be closed
        } else {
             //do the opposite here, and then also save its status with the cookie.
          }
    });

});

像这样，每当有人打开/关闭盒子（或点击按钮）时，其状态将保存在cookie中，用户不会知道页面之间的差异。

OH和PS，此代码必须放在footer.php或header.php文件（或html）中，以便在每个页面上进行检查。

希望这有助于引导你朝着正确的方向前进

为多个页面保持相同的css＆＃34;迷你吧＆＃34;如果它被显示

1 个答案: