jquery: не запускать скрипт, если он содержит .active - PullRequest
0 голосов
/ 17 ноября 2010

У меня есть скрипт, который анимирует меню. Я не хочу, чтобы в меню содержался объект с активным классом (.active). Я не могу понять это. Я пробовал несколько вещей, но я думаю, что я все думаю неправильно. Вы можете мне помочь?

Это скрипт:

$('#navigation .toplevel, #navigation > ul > li').each(function(idx) {
    $(this).delay( idx * 600 ).fadeIn( 600 );
});

Это разметка:

<div id="navigation">
        <a href="#" class="toplevel">Menu</a>
        <ul class="undermenu"> 
            <li><a href="#">1.0 Menuitem</a>             
                <ul> 
                    <li><a href="#" class="active">1.1 Menuitem</a></li>                     
                    <li><a href="#">1.2 Menuitem</a></li>
                </ul> 
            </li>
            <li><a href="#">2.0 Menuitem</a>             
                <ul> 
                    <li><a href="#">2.1 Menuitem</a></li>                     
                    <li><a href="#">2.2 Menuitem</a></li>
                </ul> </li> 
        </ul> 
</div>

Если UL содержит , содержит активный класс, я хочу, чтобы он показывался по умолчанию, а LI (родитель) получал .active-класс.

Есть ли смысл?



* EDIT: *

Сценарий не должен запускаться, если основной UL содержит дочерний элемент (или дочерний дочерний элемент) с .active-class. Я думаю, это вопрос ЕСЛИ / ТО? Но я не знаю, как это написать.

И ...

Если «UL LI UL LI A » активен, то «UL LI » (родители, родители, родитель: D) должен быть присвоен .active класс. Как мне это сделать?

Заранее спасибо ...:)

Ответы [ 4 ]

1 голос
/ 17 ноября 2010

Сначала назначьте класс .active родительским элементам UL. Вы можете просто изменить селектор ниже, чтобы перебирать элементы UL и добавлять класс .active к их родительским элементам LI:

$('#navigation > ul > li .active').each(function(){
     $(this).parent().addClass('active');
 });

Это гарантирует, что ни один из ваших .active тегов не будет анимирован:

$('#navigation .toplevel, #navigation > ul > li').not('.active').each(function(idx) { 
    $(this).delay( idx * 600 ).fadeIn( 600 ); 
}); 
0 голосов
/ 18 ноября 2010

Я верю, что это то, что вы хотите.

$('#navigation .toplevel, #navigation > ul > li').each(function(idx) {
    $this = $(this);
    if( $this.find('li.active').length === 0 ) {
        $this.delay( idx * 600 ).fadeIn( 600 );
    }
});
0 голосов
/ 17 ноября 2010

Добавьте :not(.active) к вашему селектору.

0 голосов
/ 17 ноября 2010

Вы можете попробовать это с помощью: not () селектора jQuery.

http://api.jquery.com/not-selector/

например. выбрав li, не содержащий активный класс: $ ('# navigation ul li: not (.active)'). each ...


Edit:

  1. Вы можете добавить предложение if следующим образом:

<code>if($('#navigation ul .active').size() != 0)
{
    $('#navigation .toplevel, #navigation > ul > li').each(function(idx)
    { 
       $(this).delay( idx * 600 ).fadeIn( 600 ); 
    });
}

2.

<code>$('ul li').has('ul li a.active').addClass('active');

что-то вроде этого должно работать.

Выезд: http://api.jquery.com/size/, http://api.jquery.com/addClass/, http://api.jquery.com/has/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...