@KrotKrotKrotTest

Как добавить клик по ссылке?

Есть табы. Они работают, но если внутрь li добавить div и добавить в него текст, то табы перестают работать по клику на текст. Как это можно исправить и сделать так, чтобы табы работали не только по клику на li?
<div class=" tabs">

                <div class="tabs__btns">
                  <li index="0" class="tabs__btn ">
                    <div class="adress>Text</div>
                    <a class="adress" href="javascript:void(0);">Text</a>
                  </li>
                <li index="1" class="tabs__btn ">
                    <div class="adress">Text</div>
                    <a class="adress" href="javascript:void(0);">Text</a>
                  </li>
                </div>

                <ul class="tabs__container">
                  <li class="tabs__tab">КОНТЕНТ 0</li>
                  <li class="tabs__tab">КОНТЕНТ 1</li>
            
                </ul>

              </div>


document.addEventListener("DOMContentLoaded", () => {
  document.querySelectorAll(".tabs__container").forEach((item) => {
    item.querySelectorAll(".tabs__tab")[0].style.display = "block";
  });

  const toggleTab = (e) => {
    const parent = e.target.parentNode.parentNode;
    parent.querySelectorAll(".tabs__container .tabs__tab").forEach((tab) => {
      tab.style.display = "none";
    });
    parent.querySelectorAll(".tabs__container").forEach((tab) => {
      tab.querySelectorAll(".tabs__tab")[
        Number(e.target.getAttribute("index"))
      ].style.display = "block";
    });
  };

  document.querySelectorAll(".tabs__btns .tabs__btn").forEach((item) => {
    item.addEventListener(
      "click",
      (e) => {
        toggleTab(e);
      },
      false
    );
  });
});
  • Вопрос задан
  • 78 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

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