Javascript 使用jQuery根据URL将父菜单项和子菜单项设置为活动

我有一些代码，我正在使用一个侧导航菜单，在主如何我需要的工作

有两个侧边栏菜单，三列布局的每侧各一个。右侧的侧栏是主菜单，位于ASP.NET母版页中。此菜单根据URL将其菜单项设置为活动CSS

左侧的侧边栏是一个子菜单，位于ASP.NET NestedMasterPage中。这也会将其菜单项设置为活动

因此，父导航和子导航应同时处于活动状态。但是，当我选择左侧有子菜单项的父菜单项时，当前只有一个菜单状态子菜单项处于活动状态

我知道这与URL有关，但我不确定如何解决这个问题

$document.readyfunction{ var str=location.href.toLowerCase； $menu1 li a.eachfunction{ 如果str.indexOfthis.href.toLowerCase>-1{ $li.active.removeClassactive； $this.parent.addClassactive； } }; $menu2 li a.eachfunction{ 如果str.indexOfthis.href.toLowerCase>-1{ $li.active.removeClassactive； $this.parent.addClassactive； } }; };

---

尝试使用parentsUntil'topmenu'

$(this).parentsUntil('topmenu').addClass("active");

试试这个：

$(document).ready(function () {
    var str = location.href.toLowerCase();

    $("#menu1 li a").each(function () {
        if (str.indexOf(this.href.toLowerCase()) > -1) {


            $("#menu1 li.active").removeClass("active");

            $(this).parent().addClass("active");

        }

    });


    $("#menu2 li a").each(function () {
        if (str.indexOf(this.href.toLowerCase()) > -1) {

            $("#menu2 li.active").removeClass("active");

            $(this).parent().addClass("active");

        }

    });
});

---

主侧导航菜单的工作方式几乎符合我的要求。当我点击主导航并到达有子导航的页面时，两个导航都会高亮显示。但是，当我选择该子导航的顶部链接以外的任何链接时，主侧导航跳回结构中的顶部菜单项。我需要在选择子导航中的所有菜单项时保留主侧导航。您能做一个JSFIDLE并与我们共享吗？这将使我们更容易理解这个问题。