Javascript jQuery导航添加活动类

不知何故，我的代码在添加活动类时遇到了问题。如果选择了第一个菜单，则会将其添加到活动类的

、自身

和下一个

<nav id="cssmenu" class="sidebox_content active">
    <ul class="navmenu">
        <li class="active">
            <a href="Neu-im-Sortiment">Neue Produkte</a>
        </li>
        <li class="has-sub top-cat active"></li>
    </ul>
</nav>

---

如果点击第二个列表，那么一切都会像一个魔咒一样工作。.partent（）错误吗？

我假设如下：

• 您正试图向

  li

  和

  nav

  添加一个

  active

  类 包含

  a

  的祖先元素
• url包含

  Neu im Sortiment

  的

  href

  路径（如“”）

我怀疑主要的问题是

window.location

是一个对象，而不是字符串。对于此帖子的url，它如下所示：

window.location = {
    "ancestorOrigins": {
        "length": 0
    },
    "origin": "http://stackoverflow.com",
    "hash": "",
    "search": "",
    "pathname": "/questions/23985401/jquery-navigation-add-active-class",
    "port": "",
    "hostname": "stackoverflow.com",
    "host": "stackoverflow.com",
    "protocol": "http:",
    "href": "http://stackoverflow.com/questions/23985401/jquery-navigation-add-active-class"
};

您可以使用

window.location.href

，但完整的URL可能对您的目的没有用处。请改为尝试

window.location.pathname

$(document).ready(function () {
    "use strict";
    var path = window.location.pathname, // skip the domain and truncate any hashtag nonsense and/or url parameters 
        link = $('ul.navmenu a').filter(function (i) {
            var startOfPath = path.indexOf(this.href) === 1, // pathname starts with a slash
                anywhereInPath = path.indexOf(this.href) > -1,
                endOfPath = path.indexOf(this.href) === path.length - this.href.length;
            return startOfPath || anywhereInPath || endOfPath; // anywhereInPath is most likely to be true
        }),
        li = link.parents('li'), // to get the LI element, or you could do link.parent(), since the LI is the immediate ancestor
        nav = link.parents('nav'); // to get the NAV element, or you could do li.parents('nav'), or you could do li.parent().parent() (etc.)
        li.addClass('active'); // add class to LI
        nav.addClass('active'); // add class to NAV
        // or you could do both with the same call:
        //  $(li, nav).addClass('active');
});

压缩语法（全部链接）：

---

你想完成什么，将类活动添加到单击的菜单项中？非常感谢pete！你帮了我很多！

$(document).ready(function () {
    "use strict";
    var path = window.location.pathname, // skip the domain and truncate any hashtag nonsense and/or url parameters 
        link = $('ul.navmenu a').filter(function (i) {
            var startOfPath = path.indexOf(this.href) === 1, // pathname starts with a slash
                anywhereInPath = path.indexOf(this.href) > -1,
                endOfPath = path.indexOf(this.href) === path.length - this.href.length;
            return startOfPath || anywhereInPath || endOfPath; // anywhereInPath is most likely to be true
        }),
        li = link.parents('li'), // to get the LI element, or you could do link.parent(), since the LI is the immediate ancestor
        nav = link.parents('nav'); // to get the NAV element, or you could do li.parents('nav'), or you could do li.parent().parent() (etc.)
        li.addClass('active'); // add class to LI
        nav.addClass('active'); // add class to NAV
        // or you could do both with the same call:
        //  $(li, nav).addClass('active');
});

$(document).ready(function () {
    "use strict";
    var path = window.location.pathname;
    $('ul.navmenu a').filter(function (i) { // this selects all A elements that have an ancestor UL with class "navmenu"
        var existsInPath = yourLogic(); // and returns only those that match this criteria
        return existsInPath;
    }).parents('li').addClass('active').parents('nav').addClass('active');
});