jquery - 有关 JQuery 菜单上的 "selected"项目的帮助

Question

我正在尝试创建一个带有子菜单的简单垂直菜单。我希望突出显示所选项目以及选择子菜单，使其保持打开状态。

我迷失了:(

请帮我解决这个问题。这就是我到目前为止所拥有的

<ul id="menu"> 
 <li><a href="/Source.aspx" > New </a></li>
 <li><a href="#"> New Transaction</a>
 <ul> 
 <li><a href="/Transaction.aspx?id=S">Shipment</a></li> 
 <li><a href="/Transaction.aspx?id=R">Reciept</a></li> 
 <li><a href="/Transaction.aspx?id=DA">Disassemble</a></li> 
 <li><a href="/Transaction.aspx?id=DS">Disposal</a></li> 
 </ul> </li>
 <li><a href="/Source.aspx?id=U">Correction</a></li>
 </ul>

这是我的js:

function initMenu() {
    $("#menu ul").hide();
    $("#menu li a").click(function() {
    $("#menu li").removeClass('selected');
    $(this).parent().addClass('selected');
        $(this).next().slideToggle('normal');
    });
}
$(document).ready(function() {
    initMenu();

});

“selected”类应该以黄色突出显示菜单，现在当我点击它时它只是闪烁黄色然后消失......子菜单也不会保持打开状态:(((

Answer 1

我想知道，您是否拦截链接上的点击并执行一些 Ajax 加载？如果不是，则逻辑上所选类会消失，因为页面更改/重新加载。

要解决这个问题，您可以编写一个 init 函数来检查所有菜单 href 的 window.location 并将所选类添加到匹配中...

提示:使用 firebug 检查元素的状态(例如检查元素上是否存在选定的类)，它将帮助您理解...