【问题标题】:Loop through list elements, and add class if list element contains another list遍历列表元素,如果列表元素包含另一个列表,则添加类
【发布时间】:2012-02-06 15:58:58
【问题描述】:

这里的问题很简单,但它一直困扰着我。

我的手风琴菜单设置如下:

<ul id="menu" class="navigation">
    <li><a href="#"><span>Dashboard</span></a>
        <ul>
            <li><a href="#">Dashboard</a></li>
            <li><a href="#">Articles &amp; Posts</a></li>
            <li><a href="#">Pages</a></li>
        </ul>
    </li>
    <li><a href="#"><span class="icon_articles">Articles &amp; Posts</span></a>
        <ul>
            <li><a href="#">Dashboard</a></li>
            <li><a href="#">Articles &amp; Posts</a></li>
            <li><a href="#">Pages</a></li>
        </ul>
    </li>
    <li><a href="#"><span class="icon_pages">Pages</span></a></li>
    <li><a href="#"><span class="icon_media">Media Gallery</span></a>
        <ul>
            <li><a href="#">Dashboard</a></li>
            <li><a href="#">Articles &amp; Posts</a></li>
            <li><a href="#">Pages</a></li>
        </ul>
    </li>
    <li><a href="#"><span class="icon_calendar">Calendar</span></a></li>
    <li><a href="#"><span class="icon_demos">Features &amp; Demos</span></a>
        <ul>
            <li><a href="#">Dashboard</a></li>
            <li><a href="#">Articles &amp; Posts</a></li>
            <li><a href="#">Pages</a></li>
        </ul>
    </li>
    <li><a href="#"><span class="icon_settings">Settings</span></a></li>
    <li><a href="#"><span class="icon_logout">Logout</span></a></li>
</ul>

我有一个运行手风琴的 jQuery 脚本:

function accordionMenu() {
$('ul.navigation ul').hide();
$('ul.navigation li a').click(
    function() {
        var parentElement = this.parentNode.parentNode.id;
        var elementTest = $(this).next();

        if((elementTest.is('ul')) && (elementTest.is(':visible'))) {
            $('#' + parentElement + ' ul:visible').slideUp('fast');
            $(this).removeClass('active');
            return false;
        }
        if((elementTest.is('ul')) && (!elementTest.is(':visible'))) {
            $('#' + parentElement + ' ul:visible').slideUp('fast');
            elementTest.slideDown('fast');
            $('ul.navigation a').removeClass('active');
            $(this).addClass('active');
            return false;
        }
    }
);
}

$(document).ready(function() {accordionMenu();});

现在我需要弄清楚如何循环遍历列表项,并找到其后有列表的项(即,单击时下拉以显示隐藏列表的项。)。然后我需要在每一个的末尾添加一个跨度(在 和

    之间)。就是这样。这只是让我感到困惑 - 我应该怎么做?

    谢谢,

    亚历克斯

【问题讨论】:

  • 你的问题的标题说你想添加一个类,但问题本身说你想附加一个&lt;span&gt; 元素 - 它是什么?

标签: jquery list loops add


【解决方案1】:
$('ul.navigation').children().has("ul").each(function(){
    $(this).children("a").append("<span>test</span>");              
});

这应该可行 :) 祝你的项目好运。

【讨论】:

    【解决方案2】:
    $("#menu ul").each(function(){
        $(this).closest("li").addClass("whatever_class_you_need")
            .find("a").first().after("<span>something goes here</span>");
    });
    

    【讨论】:

      【解决方案3】:

      :has 选择器非常适合这种情况。

      $("#menu li:has(ul)").addClass("hasSubMenu");
      

      【讨论】:

        【解决方案4】:

        你可以试试这个。

        $('ul.navigation li').filter(function(){
            return $(this).children('ul').length > 0;
        }).each(function(){
            $(this).find('a').after('<spam />');
        })
        .addClass('className');
        

        【讨论】:

          猜你喜欢
          • 2013-05-26
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2019-03-02
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2012-06-13
          相关资源
          最近更新 更多