在页面更改时保持菜单扩展处于打开状态

问题描述

| 我有一个使用jQuery的扩展菜单。除以下几点外，它运作良好：当用户离开页面导航时，菜单会折叠。我希望当用户单击任何最终的

链接时菜单保持打开状态。所有这些链接将打开同一页面。这些页面上的内容是从数据库中获取的，并由？id =确定。 这是代码： HTML：

 <ul id=\"nav\">
    <li><a href=\"javascript:;\">Products</a>
           <ul id=\"nav2\">
        <li><a href=\"javascript:;\">Domestic Market</a>
            <ul>
                <li><a href=\"index.PHP?page=Product&id=1\">Link1</a></li>
                    <li><a href=\"index.PHP?page=Product&id=2\">Link2</a></li>
                    <li><a href=\"index.PHP?page=Product&id=3\">Link3</a></li>
        </ul>
       </li>
       <li><a href=\"javascript:;\">Commercial Market</a>
            <ul>
                <li><a href=\"\">Coming Soon</a></li>
            </ul>
       </li>
      </ul>
       </li>
       </ul>

CSS：

ul {
    padding: 0px;
    margin: 0px;
    width: 10em;
        list-style-type:none;

}
li {
     font: 100% Verdana,Arial,Helvetica,sans-serif;
 font-size:12px;
 color:#003;  
}

li ul {
    display: none;
}
li.active > ul {
    display: block;
}

jQuery的：

$(\'#nav\').delegate(\'li,a\',\'click\',function(e) {
    e.stopPropagation();

    var self = $(e.target),//get a reference to the clicked element
        active = self.parents().andSelf() //select all li\'s that should be active
        .addClass(\'active\'); //and activate them
    $(\'#nav .active\').not(active).removeClass(\'active\'); //deactivate others  
});

$(document).click(function(){
    $(\'.active\').removeClass(\'active\'); 
});

如何保持最后的

\？     

解决方法

        我建议将值存储在cookie中，然后在页面加载时进行设置。 首先，建议您在此处下载jQuery cookie插件。 这是一个很好的插件，而且很小。设置值：

$.cookie(\"cookie_name\",\"cookie_value\");

然后在document.ready上可以拉取值：

$.cookie(\"cookie_name);

并以类似于您当前点击功能的方式对其进行适当设置。