Участник:_DiWoD_:ru/common.js — различия между версиями
Версия 15:20, 28 сентября 2023 | Текущая версия на 16:42, 28 сентября 2023 | |||
не показаны 3 промежуточные версии этого же участника | ||||
Строка 1: | Строка 1: | |||
? | var | + | //Получение всех блоков с табами | |
+ | var tlbAll = document.querySelectorAll(".main-tlb"); | |||
//Выдаём каждому табу уникальный номер | //Выдаём каждому табу уникальный номер | |||
? | for (mb_i = 0; mb_i < | + | for (mb_i = 0; mb_i < tlbAll.length; mb_i++) { | |
? | | + | tlbAll[mb_i].setAttribute("maintabs-num", mb_i); | |
//Получаем табы и листы на первом уровне вложенности | //Получаем табы и листы на первом уровне вложенности | |||
? | var tabAll = | + | var tabAll = tlbAll[mb_i].querySelectorAll( | |
? | var listAll = | + | '[maintabs-num="' + mb_i + '"] > * > .tab-item:nth-child(1n)' | |
+ | ); | |||
+ | var listAll = tlbAll[mb_i].querySelectorAll( | |||
+ | '[maintabs-num="' + mb_i + '"] > .list-item:nth-child(1n)' | |||
+ | ); | |||
//Даём каждому табу номер блока и номер таба | //Даём каждому табу номер блока и номер таба | |||
for (tb_i = 0; tb_i < tabAll.length; tb_i++) { | for (tb_i = 0; tb_i < tabAll.length; tb_i++) { | |||
tabAll[tb_i].setAttribute("maintabs-num", mb_i); | tabAll[tb_i].setAttribute("maintabs-num", mb_i); | |||
tabAll[tb_i].setAttribute("tabtabs-num", tb_i); | tabAll[tb_i].setAttribute("tabtabs-num", tb_i); | |||
? | item = tabAll[tb_i]; | + | var item = tabAll[tb_i]; | |
? | item.addEventListener( | + | item.addEventListener("click", function (event) { | |
? | + | tabFun = document.querySelectorAll(".tab-item"); | ||
? | + | listFun = document.querySelectorAll(".list-item"); | ||
? | + | eventMainAtr = event.target.getAttribute("maintabs-num"); | ||
? | + | eventTabAtr = event.target.getAttribute("tabtabs-num"); | ||
? | + | for (mb_j = 0; mb_j < tabFun.length; mb_j++) { | ||
? | + | if (tabFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) { | ||
? | + | tabFun[mb_j].classList.remove("t-active"); | ||
? | + | |||
? | + | |||
} | } | |||
? | + | } | ||
? | + | for (mb_j = 0; mb_j < listFun.length; mb_j++) { | ||
? | + | if (listFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) { | ||
? | + | listFun[mb_j].classList.remove("l-active"); | ||
} | } | |||
? | + | } | ||
? | + | listTarget = document.querySelector( | ||
? | + | '[maintabs-num="' + | ||
? | + | eventMainAtr + | ||
? | + | '"][listtabs-num="' + | ||
+ | eventTabAtr + | |||
+ | '"]' | |||
+ | ); | |||
+ | event.target.classList.add("t-active"); | |||
+ | listTarget.classList.add("l-active"); | |||
+ | }); | |||
} | } | |||
? | ||||
for (lb_i = 0; lb_i < listAll.length; lb_i++) { | for (lb_i = 0; lb_i < listAll.length; lb_i++) { | |||
listAll[lb_i].setAttribute("maintabs-num", mb_i); | listAll[lb_i].setAttribute("maintabs-num", mb_i); | |||
listAll[lb_i].setAttribute("listtabs-num", lb_i); | listAll[lb_i].setAttribute("listtabs-num", lb_i); | |||
+ | } | |||
+ | } | |||
+ | if (tlbAll.length > 0) { | |||
+ | var tabZero = document.querySelectorAll('.tab-item[tabtabs-num="' + 0 + '"]'); | |||
+ | var listZero = document.querySelectorAll('.list-item[listtabs-num="' + 0 + '"]'); | |||
+ | for (tz_i = 0; tz_i < tabZero.length; tz_i++) { | |||
+ | tabZero[tz_i].classList.add("t-active"); | |||
+ | } | |||
+ | for (lz_i = 0; lz_i < listZero.length; lz_i++) { | |||
+ | listZero[lz_i].classList.add("l-active"); | |||
} | } | |||
} | } |
Текущая версия на 16:42, 28 сентября 2023
//Получение всех блоков с табами var tlbAll = document.querySelectorAll(".main-tlb"); //Выдаём каждому табу уникальный номер for (mb_i = 0; mb_i < tlbAll.length; mb_i++) { tlbAll[mb_i].setAttribute("maintabs-num", mb_i); //Получаем табы и листы на первом уровне вложенности var tabAll = tlbAll[mb_i].querySelectorAll( '[maintabs-num="' + mb_i + '"] > * > .tab-item:nth-child(1n)' ); var listAll = tlbAll[mb_i].querySelectorAll( '[maintabs-num="' + mb_i + '"] > .list-item:nth-child(1n)' ); //Даём каждому табу номер блока и номер таба for (tb_i = 0; tb_i < tabAll.length; tb_i++) { tabAll[tb_i].setAttribute("maintabs-num", mb_i); tabAll[tb_i].setAttribute("tabtabs-num", tb_i); var item = tabAll[tb_i]; item.addEventListener("click", function (event) { tabFun = document.querySelectorAll(".tab-item"); listFun = document.querySelectorAll(".list-item"); eventMainAtr = event.target.getAttribute("maintabs-num"); eventTabAtr = event.target.getAttribute("tabtabs-num"); for (mb_j = 0; mb_j < tabFun.length; mb_j++) { if (tabFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) { tabFun[mb_j].classList.remove("t-active"); } } for (mb_j = 0; mb_j < listFun.length; mb_j++) { if (listFun[mb_j].getAttribute("maintabs-num") === eventMainAtr) { listFun[mb_j].classList.remove("l-active"); } } listTarget = document.querySelector( '[maintabs-num="' + eventMainAtr + '"][listtabs-num="' + eventTabAtr + '"]' ); event.target.classList.add("t-active"); listTarget.classList.add("l-active"); }); } for (lb_i = 0; lb_i < listAll.length; lb_i++) { listAll[lb_i].setAttribute("maintabs-num", mb_i); listAll[lb_i].setAttribute("listtabs-num", lb_i); } } if (tlbAll.length > 0) { var tabZero = document.querySelectorAll('.tab-item[tabtabs-num="' + 0 + '"]'); var listZero = document.querySelectorAll('.list-item[listtabs-num="' + 0 + '"]'); for (tz_i = 0; tz_i < tabZero.length; tz_i++) { tabZero[tz_i].classList.add("t-active"); } for (lz_i = 0; lz_i < listZero.length; lz_i++) { listZero[lz_i].classList.add("l-active"); } }