jQuery Accordion Menu 中的活动页面答案

【问题标题】：Active page in jQuery Accordion MenujQuery Accordion Menu 中的活动页面
【发布时间】：2013-05-28 22:00:44
【问题描述】：

首先，如果这个问题已经得到解答，请原谅我，我搜索但找不到与我正在尝试做的事情相关的示例。

我有一个带有一些子菜单的垂直菜单。单击顶层菜单时，将打开子菜单。问题是当您到达新页面时，我希望您单击的子菜单保持打开状态。就像现在一样，当单击子菜单项并转到目标页面时，菜单会折叠。

这是我的代码：

<script type="text/javascript" charset="utf-8">
$(function(){
    $('#menu li a').click(function(event){
        var elem = $(this).next();
        if(elem.is('ul')){
            event.preventDefault();
            $('#menu ul:visible').not(elem).slideUp();
            elem.slideToggle();
        }
    });
});
</script>

还有一个小提琴：

http://jsfiddle.net/4fYS6/

提前致谢

【问题讨论】：

我建议将活动菜单索引保存到 cookie 中，然后在进入新页面后将其取回（+ 将项目设置在特定索引处）。有关如何使用 jQuery 设置/读取 cookie，请参阅How to set cookies with jQuery。
在 JSfiddle 中你没有移动到下一页？...所以无法复制您的问题...通过单击链接，您是通过 ajax 加载页面内容还是？完全加载第二页？
我正在完全加载页面第二页@rahul maindargi

标签： jquery menu accordion

【解决方案1】：

如果你想避免 cookie，试试这个

HTML

  <iframe  src="" name='frame' >
  </iframe>  

<li><a href="http://www.bing.com" target="frame">Submenu 1</a></li>

CSS

div{
  display:inline-block;
}
#frm{
  height:500px;
  width:500px;
 border:0px solid black;

}

Demo

根据需要调整样式。

【讨论】：

【解决方案2】：

当您完全加载第二页时，您可以将选定的UL 索引传递回服务器并作为响应返回，并在页面加载时再次打开该UL。

类似于下面的代码...（不是确切的代码。）DEMO

$(function(){
    $('#menu li a').click(function(event){
        var elem = $(this).next();
        if(elem.is('ul')){
            event.preventDefault();
            $('#menu ul:visible').not(elem).slideUp();
            elem.slideToggle();
        } else {
          alert("Parent Index "+$('#menu ul').index($(this).parent().parent()));
            $(this).attr("href" ,$(this).attr("href")+"?MenuIndex="+ $('#menu ul').index($(this).parent().parent()));

        }

    });
function getURLParameter(name) {
    return decodeURI(
        (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
    );
}

    if(getURLParameter("MenuIndex")) {
     $('#menu ul').eq(getURLParameter("MenuIndex")).click();
    }
});

【讨论】：