kenwheeler/slick jak uzyskać bieżący slajd jako obiekt dom lub jquery?

Question

Korzystanie slick, Mam proste karuzelę wzdłuż linii:

<div class="carousel"> 
    <div class="image"><img src="http://path/to/image.jpg" data-caption="Caption 1"></div> 
    <div class="image"><img src="http://path/to/image2.jpg" data-caption="Caption 2"></div> 
    <div class="image"><img src="http://path/to/image3.jpg" data-caption="Caption 3"></div> 
</div> 

ja inicjalizacji karuzelę z funkcją onAfterChange spróbować zaktualizować podpis w innym div, ale jestem trochę mylić o tym, jak uzyskać to div jako obiekt dom lub jquery?

$('.carousel').slick({ 
    lazyLoad: 'progressive', 
    onAfterChange: function(slider,index){ 
    console.log(???); 
    } 
}); 

Gdzie slider zwraca obiekt karuzeli i index zwraca bieżący slajd.

Jak mogę uzyskać z tego wartość data-caption?

Answer 1

Arg, przepraszam, znalazłem rozwiązanie problemu z github pod tytułem Accessing Current Slide Attributes in onAfterChange #411.

slider odnosi się do karuzeli, tak by uzyskać dostęp suwak tak:

$(slider) i ma dostęp do konkretnego slajdu z $(slider.$slides.get(index))

Tak więc w odniesieniu do mojego pytania powyżej, byłoby po prostu:

$(slider.$slides.get(index)).data('caption'); 

Answer 2

spróbować

$('.carousel').on('afterChange', function() { 
    var dataId = $('.slick-current').attr("data-slick-index");  
    console.log(dataId); 
}); 

Answer 3

przed zmianą

jQuery('.pt-slick-carousel__slides').on('beforeChange', function(event, slick, currentSlide, nextSlide){ 
     console.log(jQuery('.pt-slick-carousel__slides .slick-active').attr('data-slick-index')); 
     console.log(jQuery('.pt-slick-carousel__slides .slick-active').attr('id')); 
}); 

AfterChange

jQuery('.pt-slick-carousel__slides').on('afterChange', function(event, slick, currentSlide, nextSlide){ 
     console.log(jQuery('.pt-slick-carousel__slides .slick-active').attr('data-slick-index')); 
     console.log(jQuery('.pt-slick-carousel__slides .slick-active').attr('id')); 
});