Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.09.2015, 12:29
Новичок на форуме
Отправить личное сообщение для NirVanea Посмотреть профиль Найти все сообщения от NirVanea
 
Регистрация: 10.09.2015
Сообщений: 3

Подскаите как менять класс у елемента в зависимость от класса другово елемента
Подскажите как менять класс у элемента в зависимость от класса другого элемента.

Есть вот такой код:

<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title">
				<a href="#1" >...</a>
			</h4>
		</div>
		<div id="1" class="panel-collapse in">..</div>
	</div>
	<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title">
				<a href="#1" >...</a>
			</h4>
		</div>
		<div id="1" class="panel-collapse">..</div>
	</div>
	<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title">
				<a href="#1" >...</a>
			</h4>
		</div>
		<div id="1" class="panel-collapse">..</div>
	</div>



Класс "in" добавляется каким плагином в случае если пункт аккордеона открыт и удаляется если закрыт.

Подскажите пожалуйста как с помощью jQuery при клике на ссылку проверять если существует класс "in" то у загаловка "<h4 class="panel-title">" добавляется класс "active" а если нету то удаляет класс "active" у даного елемента.
Ответить с цитированием
  #2 (permalink)  
Старый 10.09.2015, 12:58
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

// вешаем событие click на .panel-title a
$('.panel-title a').click(function() {
        // находим элемент .panel-collapse
	var $panelC = $(this).closest('.panel').find('.panel-collapse');
        // находим .panel-title
	var panelTitle = $(this).closest('.panel-title');
        //  если у $panelC есть класс in
	if ($panelC.hasClass('in')) {
                // то добавляем $panelTitle класс active
		$panelTitle.addClass('active');
	}
        // иначе
	else {
                // убираем класс active
		$panelTitle.removeClass('active');
	} 
});

closest() - https://api.jquery.com/closest/
find() - https://api.jquery.com/find/

Последний раз редактировалось Lemme, 10.09.2015 в 14:14.
Ответить с цитированием
  #3 (permalink)  
Старый 10.09.2015, 13:44
Новичок на форуме
Отправить личное сообщение для NirVanea Посмотреть профиль Найти все сообщения от NirVanea
 
Регистрация: 10.09.2015
Сообщений: 3

Lemme , большое спасибо, всё работает отлично. Но так как я толь начинаю изучать javascript хотел тебя попросит прокомментировать код что я тоже понял как это чудо работает.
Ответить с цитированием
  #4 (permalink)  
Старый 10.09.2015, 14:13
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

NirVanea, добавил комменты.
Ответить с цитированием
  #5 (permalink)  
Старый 10.09.2015, 14:51
Новичок на форуме
Отправить личное сообщение для NirVanea Посмотреть профиль Найти все сообщения от NirVanea
 
Регистрация: 10.09.2015
Сообщений: 3

Lemme, большое спасибо, теперь понял логику
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 12:29
Как при появление класса в блоке1, добавить класс в блок2? raindew jQuery 3 11.10.2013 21:05
Использование классов в JavaScript devote Ваши сайты и скрипты 70 01.02.2013 16:17