带UL和LI引导程序的动态菜单

Dynamic Menu with UL and LI Bootstrap

本文关键字:动态 菜单 引导程序 LI UL      更新时间:2023-09-26

我正在寻找ulli父级。

我想要的ul将有class="level3 dropdown-menu dynamic"

当我发现这样的东西时,我需要向它添加另一个类。要添加到li的类的父级将是class="dropdown-submenu"

如何使用jquery完成此操作?我试过一些,但都没有达到我想要的效果。按照自动生成的Menu的代码,也按照创建Menu的jquery。

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<a href="#Menu2_SkipLink" style="position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;">Skip Navigation Links</a>
<div id="Menu2" style="float: left;">
    <ul class="level1 nav navbar-nav static" tabindex="0" role="menubar" style="position: relative; width: auto; float: left;">
        <li class="dropdown-toggle open" aria-haspopup="Menu2:submenu:2" role="menuitem" style="">
            <a class="popout level1 static" href="javascript:;" tabindex="-1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">Services</a>
            <ul class="level2 dropdown-menu dynamic" id="Menu2:submenu:2" style="">
                <li class="dropdown-toggle" aria-haspopup="Menu2:submenu:3" role="menuitem" style="">
                    <a class="popout level2 dynamic" href="#" tabindex="-1">Consulting</a>
                    <ul class="level3 dropdown-menu dynamic" id="Menu2:submenu:3" style="">
                        <li role="menuitem" class="dynamic" style="">
                            <a class="level3 dynamic" href="dutsourcing.aspx" tabindex="-1">Teste de SubMenu</a>
                        </li>
                    </ul>
                </li>
                <li role="menuitem" class="dynamic" style="">
                    <a class="level2 dynamic" href="Outsourcing.aspx" tabindex="-1">Outsourcing</a>
                </li>
            </ul>
        </li>
    </ul>
</div>
<div style="clear: left;">
</div>
<a id="Menu2_SkipLink"></a>

Jquery:

 Sys.WebForms.Menu._elementObjectMapper.getMappedObject = function () {
            return false;
        };
        $(function () {
            //Remove the style attributes.
            $(".navbar-nav li, .navbar-nav a, .navbar-nav ul").removeAttr('style');
            //Apply the Bootstrap class to the Submenu.
            $(".dropdown-menu").closest("li").removeClass().addClass("dropdown-toggle");
            //Apply the Bootstrap properties to the Submenu.
            $(".dropdown-toggle").find("a").eq(0).attr("data-toggle", "dropdown").attr("aria-haspopup", "true").attr("aria-expanded", "false");
            //Apply the Bootstrap "active" class to the selected Menu item.
            $("a.selected").closest("li").addClass("active dropdown-submenu");
            $("a.selected").closest(".dropdown-toggle").addClass("active dropdown-submenu");
        });

https://api.jquery.com/parent/

$("li")parent(".level3下拉菜单动态").addClass("下拉子菜单");

是这样吗?

好吧,经过对您的代码mHenderson的测试,我终于得到了答案!

 $(function () {
            $("ul.level3").parent("").addClass("dropdown-submenu");
        });

感谢

相关文章: