2016-09-07 3 views
-2

Я использую следующий код, чтобы попробовать и поменять класс только в том случае, если на странице присутствует определенное имя класса;Оператор if для переопределения класса

$(function() { 
    if ($('.special').length){ 
     $(".tab_item").removeClass("tab_item_color").addClass("tab_item_color"); 
    } 
}); 

Так на английском языке: Если класс «специальный» присутствует, а затем удалить .tab_item и добавить tab_item_color вместо этого.

Это то, что я хочу. Правильно ли это читается? Следует ли использовать swapClass?

+2

* ли это прочитать правильный * Нет, это не делает?. Вы удаляете 'tab_item_color', а не' tab_item'. –

+3

Typo? Вы удаляете, затем добавляете тот же класс –

+0

Вы имеете в виду toggleClass() или jQueryUI's switchClass()? Может быть, я не знаю swapClass() в jQuery –

ответ

1

вы можете использовать ниже код, вы должны проверить special класс существует в элементе

$(function() { 
    $('.tab_item').each(function(){ 
     if($(this).hasClass("special")){ 
      $(this).removeClass("tab_item").addClass("tab_item_color"); 
     } 
    }); 
}); 

или

$(function() { 
    $('.tab_item.special').removeClass("tab_item").addClass("tab_item_color"); 
}); 
+2

У вас есть ошибка в условии if: –

+0

@TheOneandOnlyChemistryBlob Спасибо за маркировку ... –

+1

Пока вопрос неясен, он указывает «* только если на странице есть определенное имя класса» - нет: если класс имя отображается на вкладке. –

2

Для обработки ситуации, как «Если класс special присутствует в настоящем документе, затем удалите tab_item и добавьте tab_item_color вместо "; Вы можете сделать следующее вещь:

$(function() { 
 
    if ($('.special').length > 0) //checking count of DOM element with class special 
 
    { 
 
    $(".tab_item").removeClass("tab_item").addClass("tab_item_color"); 
 
    } 
 
});
.tab_item { 
 
    background: none; 
 
} 
 
.tab_item_color { 
 
    background: blue; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="special">div with special class</div> 
 

 
<div class="tab_item">div 1</div> 
 
<div class="tab_item">div 2</div> 
 
<div class="tab_item">div 3</div>

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