2013-10-05 2 views
-1

У меня есть различные элементы, которые имеют класс .folderбратий Активного класса removeClass

Когда я нажимаю один я хочу, чтобы добавить класс active к нему и удалить класс из любого другого элемента.

Проблема заключается в том, чтобы удалить класс из других в первую очередь, его просто не делать.

Вот что я хочу:

$('.folder').click(function() { 
    $(this).siblings('.folder').removeClass('active'); // remove from all other <SPAN>s 
    $(this).addClass('active'); // add onto current 
}) 

Пример HTML:

<ul> 
    <li class="closed last"> 
     <span class="folder" id="16">More coding</span> 
    </li> 
</ul> 
</li> 
<li class="closed collapsable lastCollapsable"> 
    <span class="folder active" id="12">Music</span> 
    <ul style="display: block;" id="browser" class="filetree treeview-famfamfam"> 
     <li class="closed collapsable"> 
      <span class="folder active" id="13">Music child</span> 
       <ul style="display: block;" id="browser" class="filetree treeview-famfamfam"> 
        <li class="closed last"> 
         <span class="folder" id="15">More music</span> 
        </li> 
       </ul> 
     </li> 
     <li class="closed last"><span class="folder" id="17">Another child here</span> </li> 
    </ul> 
    </li> 
</ul> 
+1

Можете ли вы показать свой HTML? Я предполагаю, что они не братья и сестры. –

+1

HTML пожалуйста .... –

+0

@ Karl-AndréGagnon Я думаю, что вы правы - я должен использовать .find вместо этого, возможно, –

ответ

1

По-моему, удалить класс из всех eleemnts

$('.folder').click(function() { 
    $('.folder.active').removeClass('active'); // Just remove class from all folder 
    $(this).addClass('active'); // add onto current 
}) 
0

прост и эффективен:

$('.folder').click(function() { 
    $('span .folder').removeClass('active'); // remove from all other <SPAN>s 
    $(this).addClass('active'); // add onto current 
}) 
0

Здесь 3 варианта решения.

Одна из основных:

$('span.folder').click(function() { 
    $('.folder').removeClass('active'); 
    $(this).addClass('active'); 
}) 

Один немного быстрее:

$('.folder').click(function() { 
    $('span.folder.active').removeClass('active'); 
    $(this).addClass('active'); 
}) 

Самый быстрый, но не будет работать, если есть другие элементы с .active:

$('.folder').click(function() { 
    $('.active').removeClass('active'); 
    $(this).addClass('active'); 
}) 

JSPerf: http://jsperf.com/three-solutions

Смежные вопросы