【问题标题】:Jquery addClass to multiple liJquery addClass到多个li
【发布时间】:2017-09-11 02:06:25
【问题描述】:

我的主要导航结构如下:

<li>
    <a class="dropdown-toggle" href="about">
        <?php echo nav_about ?>
    </a>
    <ul class="dropdown-menu">
        <li>
            <a href="<?php echo BASEURL ?>/about-us.html">
                <?php echo nav_about_profile ?>
            </a>
        </li>
        <li>
            <a href="<?php echo BASEURL ?>/committee.html">
                <?php echo nav_about_committee ?>
            </a>
        </li>
    </ul>
</li>

当 url 和链接匹配时,相应项目的突出显示脚本:

/* highlight nav menu */
$(function(){
    $('#topMain.nav-pills li a').each(function(index) {
        if($.trim(this.href) == stripQueryStringAndHashFromPath(window.location.href)) {
            $(this).closest('li').addClass('active');
        }
    });
});

function stripQueryStringAndHashFromPath(url) {
    return url.split("?")[0].split("#")[0];
}

我可以将active 添加到其最近的超链接li,但我想寻找一种方法将active 添加到最顶部的li,结果如下:

<li class="active"> <-- I NEED THIS CLASS TO BE ADD ALSO
    <a class="dropdown-toggle" href="about">
        <?php echo nav_about ?>
    </a>
    <ul class="dropdown-menu">
        <li class="active">
            <a href="<?php echo BASEURL ?>/about-us.html">
                <?php echo nav_about_profile ?>
            </a>
        </li>
        <li>
            <a href="<?php echo BASEURL ?>/committee.html">
                <?php echo nav_about_committee ?>
            </a>
        </li>
    </ul>
</li>

【问题讨论】:

  • parentli一样将类添加到顶级父li,然后使用closest(),如.closest('li.parentli'),如果你喜欢这样,它会选择最上面的li,就像你想要的那样
  • @guradio,谢谢你的工作!
  • 很高兴能帮助队友 :) 快乐编码

标签: jquery menuitem highlight


【解决方案1】:

试试这个:

$('.dropdown-menu li:has(a[href="'+opened_path+'"])').addClass('active')
.parent().closest('li')
.addClass('active');

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-02-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多