Можете объяснить данную функцию?

148
30 июня 2022, 03:30

Ясно, что при нажатии на ul.tabs__caption происходит событие и что дальше?

(function($) {
$(function() {
  
  $('ul.tabs__caption').on('click', 'li:not(.active)', function() {
    $(this)
      .addClass('active').siblings().removeClass('active')
      .closest('div.tabs').find('div.tabs__content').removeClass('active').eq($(this).index()).addClass('active');
  });
  
});
})(jQuery);

Answer 1

На li у которых отсутсвует класс .active, при нажатии, вешается функция, которая:

Первая строка:

  • добавляет класс active для нажатого li .addClass('active')
  • берет остальные элементы, на том же уровнеsiblings() и удаляет у них класс active .removeClass('active')

Вторая строка:

  • берет ближайший div c классом .tabs closest('div.tabs')
  • находит в них дивы с классами .tabs__content find('div.tabs__content') и удаляет во всех нашедшихся дивах классы active .removeClass('active')
  • берет элемент с порядковым номером (нумерация с нуля) нажатого li eq($(this).index()) и добавляет туда класс active .addClass('active')

$(this) это текущий элемент li (на который нажали)

тоесть фактически происходит переключение класса active в элементах li и переключение класса active в дивах с учетом нажатого элемента li

READ ALSO
Не задаётся фон-градиент на Vue.js

Не задаётся фон-градиент на Vue.js

У меня имеются два метода, которые задают фон отдельному блокуПервый метод задаёт сплошной фон, а второй - градиент

151
Вывести массив без строк

Вывести массив без строк

Нужно отфильтровать массив, не используя какие-либо методы массивов и строкНе знаю, как можно так отфильтровать, чтобы не использовать push для...

232
События типа: wheelup, wheeldown

События типа: wheelup, wheeldown

Необходимо отслеживать прокрутку колесика мыши: вверх или внизПри этом сам элемент не скроллится

112