Перебирайте элементы списка и добавляйте класс, если элемент списка содержит другой список - PullRequest
2 голосов
/ 06 февраля 2012

Довольно простая проблема, но она меня немного беспокоит.

У меня меню гармошки настроено так:

<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();});

Теперь мне нужно выяснить, как перебрать элементы списка, и найти те, у которых есть списки, следующие за ними (то есть те, которые при нажатии выпадают, чтобы показать скрытый список). Затем мне нужно добавить диапазон в конце каждого (между и

Ответы [ 4 ]

1 голос
/ 06 февраля 2012
$('ul.navigation').children().has("ul").each(function(){
    $(this).children("a").append("<span>test</span>");              
});

это должно сработать :) удачи в вашем проекте.

1 голос
/ 06 февраля 2012

Селектор : имеет идеально подходит для этого сценария.

$("#menu li:has(ul)").addClass("hasSubMenu");
1 голос
/ 06 февраля 2012

Вы можете попробовать это.

$('ul.navigation li').filter(function(){
    return $(this).children('ul').length > 0;
}).each(function(){
    $(this).find('a').after('<spam />');
})
.addClass('className');
1 голос
/ 06 февраля 2012
$("#menu ul").each(function(){
    $(this).closest("li").addClass("whatever_class_you_need")
        .find("a").first().after("<span>something goes here</span>");
});
...