@Lord_Dantes
Full stack Developer

Почему не работает код jQuery?

У нас есть ссылки на которые мы нажимаем и получаем их айди и заносим в переменную.
$('.tab-nav a').click(function(){
    var $fast = $(this).attr('id');                 
  });

Также дальше при клике мы используем переменную и вставляем в обращение к элементу.
$('.tab-nav a').click(function(){
    var $fast = $(this).attr('id');         
    $(".tab-panels > div#"+ $fast + "").show();
});

Делал console.log(), и все работает, дивка с айди находится но функция .show() не применяется.
Мне нужно чтобы при клике на ссылку отображалась div-элемент с соответствующим id.

Спасибо за внимание
Песочница
  • Вопрос задан
  • 78 просмотров
Решения вопроса 2
@BRAGA96
ID это уникальный идентификатор, а у Вас их по 2 штуки:
<a href="javascript:void(0);" id="1"></a>
<div id="1">Info 1 </div>


Используйте data-* атрибуты
Ответ написан
Vlad_IT
@Vlad_IT
Front-end разработчик
В HTML есть тоже правило именования id. У вас id это тупо число, такого не может быть. Добавьте префикс к id.
Пример https://codepen.io/anon/pen/pqreVY?editors=1010
Хоть jQuery и понимает одинаковые id на странице, но лучше все таки соблюдать стандарты, и делать id уникальным на странице. https://codepen.io/anon/pen/PXKpaQ?editors=1010
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
e_svirsky
@e_svirsky
Web Developer
Вы уверены что дивка лежит именно в дочерних элементах .tab-panels?
Ищите напрямую по #$fast, зачем уточнять .tab-panels > div?
ID на странице должны быть уникальными, поэтому не нужно лишних селекторов.
По поводу чего не применяется - может и применяется, просто не видете. show - если я не ошибаюсь делает display: block, посмотрите в стили элемента, может из-за косяка в верстке он не отображается, а по факту уже display: block.
Ответ написан
Ваш ответ на вопрос

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

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