Question

我正在尝试根据页面

设置活动的li元素

我有像这样的HTML代码

                <li><a href="@Url.Action("Index", "Orders")" class=""><i class="lnr lnr-layers"></i> <span>Orders</span></a></li>
                <li><a href="@Url.Action("Index", "Clients")" class=""><i class="lnr lnr-user"></i> <span>Clients</span></a></li>
                <li>
                    <a href="#adds" data-toggle="collapse" class="collapsed"><i class="lnr lnr-rocket"></i> <span>Adds</span> <i class="icon-submenu lnr lnr-chevron-left"></i></a>
                    <div id="adds" class="collapse ">
                        <ul class="nav">
                            <li><a href="@Url.Action("Mobile", "Adds")" class="">Mobile</a></li>
                            <li><a href="@Url.Action("Push", "Adds")" class="">Push</a></li>
                        </ul>
                    </div>
                </li>

和脚本

<script type="text/javascript">
$(function () {
    var page = location.pathname;
    if (page == "/admin") {
        var menuItem = $('nav a[href="/admin/dashboard"]');
        menuItem.addClass('active');
    } else {
        var controller = page.split("/")[2];
        var menuItem = $('nav a[href*="' + controller + '"]');
        menuItem.addClass('active');
    }
})

但我可以用嵌套菜单做什么？如何使用jquery扩展它？我试图使用像menuItem.parent().parent().toggle()这样的东西，但它对我不起作用

Answer 1

我认为bootstrap将类添加到div.collapse进行切换所以试试这段代码我觉得它会起作用

('.collapse').toggleClass('in');

或

menuItem.parent().parent().parent().toggleClass('in');

Answer 2

我认为您正在寻找.closest()。

menuItem.closest('.collapse').addClass('active');

jquery展开嵌套的ul

2 个答案: