jQuery используя 'this', чтобы выбрать братьев и сестер своего родителя` для кнопки «предыдущий слайдер» - PullRequest
Новая
       9

jQuery используя 'this', чтобы выбрать братьев и сестер своего родителя` для кнопки «предыдущий слайдер»

0 голосов
/ 31 января 2020

У меня проблема с реализацией кнопки Tiny Slider prev и next на одной странице, но с несколькими экземплярами, и она лежит на каждом из jQuery элементов пользовательского интерфейса (tab-pane).

, поэтому tabs не является проблемой, но каждая вкладка обернула контейнер для слайдера с классом tns-outer, так что элемент .slide-nav, который находится рядом с (sibling) на моем контейнере слайдера, теперь уже не брат, а брат tns -внутренний (родительский) элемент. Проблема в том, что на первом слайде я мог сделать предыдущий следующий запуск просто отлично. Но когда вкладки изменены, кнопка «Вперед» и «Предыдущая» не работают вообще.

Я использую jQuery каждая и использую «this» для выбора элемента, я пытаюсь выбрать родителя для 'this' внутри функции создания объекта tns, и если он просто использует 'this', ошибки не выдаются, но если я использую jQuery (this), это всегда дает мне ошибку.

Этот код работает только на первом слайде и первая вкладка: 

listingSlider: function(){
  if (jQuery('.listings').length) {
    jQuery('.tab-content .listings').each(function() {
      var slider = tns({
        container: this,
        items: 4,
        slideBy: 1,
        autoplay: true,
        prevButton: '.prev',
        nextButton: '.next',
        nav: false,
        mouseDrag: true,
        gutter: 14,
        responsive: {
          0 : {
            items: 1,
          },
          640: {
              items: 2,
          },

          768: {
              items: 3,
          },

          992: {
            items: 4,
          },
        }
      });
      console.log('bul');
    })
    console.log('slider built')
  }
}

Тогда этот код - то, что я пытаюсь сделать, но он дает мне ошибку, мне нужен способ использовать 'this' как селектор, чтобы выбрать его родителя с классом. панель вкладок, а затем найти ребенка с классом prev / next. На prevButton я использую это без $ / jQuery, а на nextButton я использую jQuery, но все просто выдает ошибку. 

listingSlider: function(){
  if (jQuery('.listings').length) {
    jQuery('.tab-content .listings').each(function() {
      var slider = tns({
        container: this,
        items: 4,
        slideBy: 1,
        autoplay: true,
        prevButton: this.parent('.tab-pane').find('.slide-nav .prev'),
        nextButton: jQuery(this).parent('.tab-pane').find('.slide-nav .prev'),
        nav: false,
        mouseDrag: true,
        gutter: 14,
        responsive: {
          0 : {
            items: 1,
          },
          640: {
              items: 2,
          },

          768: {
              items: 3,
          },

          992: {
            items: 4,
          },
        }
      });
      console.log('bul');
    })
    console.log('slider built')
  }
}

Спасибо

...