@zahar_92

Как активировать вложенные табы на Bootstrap 3?

Всем привет!
Есть табы на bootstrap 3 с вложенными табами.
Цель: при клике по табам верхнего уровня, активируется первый вложенный таб и соответственно показывает свое содержимое.
Структура такая:
Город 1, Город 2
Город 1 ->Вкладка 1, Вкладка 2, Вкладка 3
Город 2 ->Вкладка 4, Вкладка 5, Вкладка 6

<ul id="city" class="nav nav-tabs">
	<li><a data-toggle="tab" href="#city1">Краснодар</a></li>
	<li><a data-toggle="tab" href="#city2">Сочи</a></li>
</ul>
<div class="tab-content">
	<div id="city1" class="tab-pane fade">
		<ul class="nav nav-tabs">
			<li class="active"><a data-toggle="tab" href="#address1">Аэропорт «Пашковский»</a></li>
			<li><a data-toggle="tab" href="#address2">ЖД вокзал «Краснодар-1»</a></li>
			<li><a data-toggle="tab" href="#address3">ТРЦ «Красная площадь»</a></li>
		</ul>
	</div>
	<div id="city2" class="tab-pane fade">
		<ul class="nav nav-tabs">
			<li><a data-toggle="tab" href="#address4">Аэропорт «Адлер» (Сочи)</a></li>
			<li><a data-toggle="tab" href="#address5">ТРЦ »МореМолл»</a></li>
		</ul>
	</div>
</div>

А активный город уже показывает свой текст. Сейчас при переходе на второй город, активная вкладка остается в первом городе и только после клика по нужной вкладке второго города, меняется содержимое.
  • Вопрос задан
  • 586 просмотров
Пригласить эксперта
Ответы на вопрос 1
villiwalla
@villiwalla
HTML-верстка
Смотрите на кнопки табов в первом табе, видите класс active? Смотрите на кнопки табов во втором табе, видите класса active нету? А да, видите отсутствие чего-то важного в кнопках табов для городов? Например active?
Ответ написан
Ваш ответ на вопрос

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

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