在mmenu中选择所有直接父列表条目

Question

我正在开发一个项目，我即将使用jQuery插件mmenu（http://mmenu.frebsite.nl/）。

我已经做了一些定制以满足我的需求，但我不知道如何处理我当前的问题。在mmenu中，当我点击列表条目时，我将被导航到给定的href，并且被点击的项目由mmenus css类“.mm-selected”变为活动状态。到目前为止一切都很好。

现在我想要另外标记父列表项（并且那是父项，依此类推，直到菜单根）。这应该是这样的，当用户在菜单中进入一级时，他应该能够看到他当前在哪个类别。

下面是应用mmenu后菜单html结构的示例。这显示了包含4个主页（index，page1，page2和page3）和3个子页面（2.1,2.2,2.3）的菜单的代码。

<nav id="nav" class="mm-menu mm-horizontal mm-offcanvas mm-hasheader mm-current mm-opened">
    <ul class="mm-list mm-panel mm-opened mm-current" id="mm-0">
        <li class="mm-selected">
            <a href="#/index">Index</a>
        </li>
        <li>
            <a href="#/page1">Page 1</a>
        </li>
        <li>
            <a class="mm-subopen mm-fullsubopen" href="#mm-1"></a>
            <span>Page 2</span>
        </li>
        <li>
            <a href="#/Page 3">Page 3</a>
        </li>
    </ul>
    <ul class="mm-list mm-panel mm-highest" id="mm-1">
        <li class="mm-subtitle">
            <a class="mm-subclose" href="#mm-0">Page 2</a>
        </li>
        <li>
            <a href="#/page2-1">Page 2.1</a>
        </li>
        <li>
            <a href="#/page2-2">Page 2.2</a>
        </li>
        <li>
            <a href="#/page2-3">Page 2-3</a>
        </li>
    </ul>
</nav>

如果您知道我可以在何处以及如何实现此类功能，那将是非常棒的。

Answer 1

所以，目前我做了一些jQuery黑客攻击。这似乎适用于我上面提到的情况。它也适用于更深层的菜单，因为它使用递归。如果有更好的方法来实现这一点，请告诉我。

var nav = $("#nav");

nav.find("li > a:not(.mm-subopen)").click(function () {
    nav.find("li.active").removeClass("active");
    selectParentEntry($(this));
});

var selectParentEntry = function (a) {
    var li      = a.parent(),
        ul      = li.parent(),
        back    = ul.find("li > a.mm-subclose").first(),
        cID     = "#" + ul.attr("id"),
        pID     = back.length ? back.attr("href") : null;

    li.addClass("active");

    if (pID != null) {
        var subOpen = nav.find("ul" + pID + " > li > a.mm-subopen").filter(function () {                 
            var self = $(this);
            if (self.attr("href") === cID) return self;
        }).first();

        if (subOpen) selectParentEntry(subOpen);
    }
};