Jquery - 隐藏/显示 - "会话"问题

Question

我在我的网站上使用此链接和div:

<p><a href="#" class="navlink" id="navlink_1">Menu1</a> | <a href="#" class="navlink" id="navlink_2">Menu2 |</a><a href="#" class="navlink" id="navlink_5"> Menu 3|</a></p>

<div id="menu_1" class="mymenu">
</div>
<div id="menu_2" class="mymenu">
</div>
<div id="menu_3" class="mymenu">
</div>

而这个jquery隐藏并显示菜单.

$('div[class*="mymenu"]').hide(); 
 var current;
       var showMenu = function(e) {
    // read the id out of the clicked elements id ('navlink_ID')
        var id = e.id.split('_');
        $('div#menu_' + id[1]).show();
    // store this element as new current visible
        current = e;
      }

      // hide all menu elements
      $('div.mymenu').hide();
      $('a.navlink').click(function() {
        if (this != current) {
          // check if an element is visible -> hide it and show new menu
          if (current) {
            var id = current.id.split('_');
            $('div#menu_' + id[1]).hide(200,showMenu(this));
          } else {
            showMenu(this);

          }
        }
        return false;
      }); 

如何修改此代码,如果我重新加载页面,那么最后一个可见的DIV将保持可见.(我不想为此使用查询字符串.我尝试使用jquery会话但不工作..)

谢谢你的帮助...

Answer 1

Cookie是保持可折叠div的理想方式,ShopDev有一个很好的教程,如何使用jQuery cookie插件实现与尝试相同的操作.

基本上,您在cookie中为每个div要保留的值设置一个值,并且每当事件发生时,您都会更新cookie中的值,例如:

$.cookie('menu_1', 'expanded');

您还需要检查页面何时首次加载每个页面的状态div,例如

var menu_1 = $.cookie('menu_1');

if (menu_1 == 'collapsed') {
    $('#menu_1').css("display","none");
};