@saplas

Как скрывать дочерний элемент, если у родителя есть определённый класс?

Есть скрипт, в теории он должен проверять наличие класса active и скрывать одну из двух картинок если родитель с классом active.
$(document).ready(function() {
        if($('.services-link').hasClass('active')){
            $('.blackimg').css({'display' : 'none'});
	    $('.whiteimg').css({'display' : 'block'});
        }
    });

Но постоянно одна картинка whiteimg даже если нет класса active
  • Вопрос задан
  • 200 просмотров
Решения вопроса 1
sergiks
@sergiks Куратор тега JavaScript
♬♬
Попробуйте так:
$(document).ready(function() {
  $('.services-link').each( function(){
    if ($(this).hasClass('active')){
      $('.blackimg', this).hide();
      $('.whiteimg', this).show();
    } else {
      $('.blackimg', this).show();
      $('.whiteimg', this).hide();
    }
  })
});


Приведите разметку, а лучше сделайте jsFiddle, демонстрирующий проблему.

Вроде, работает:
песочница


Точно ли вам надо решать эту задачу с помощью JS? Можно же стилями прятать/показывать, в зависимости от родительского класса. Что-то типа
.services-link .blackimage {display: block}
.services-link.active .blackimage {display: none}
.services-link .whiteimage {display: none}
.services-link.active .whiteimage {display: block}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы