获取当前 'slick' 滑块的图像（vanilla JS 或 jQuery）

Question

这就是我所说的非常有名的“圆滑”：https://kenwheeler.github.io/slick/

我发现这个非常有效的答案：

$('.slider').slick({
  dots: true,
  autoplay: true,
  autoplaySpeed: 1000,
  infinite: true,
  speed: 1000,
  slide: 'div',
  cssEase: 'linear'
 });

$('.slider').on('afterChange', function(event, slick, currentSlide, nextSlide){
  //Here I do split the `src` attribute value because I'm using an absolute path.
  // $(slick.$slides.get(currentSlide)) gives the whole slide 
  var CurrentImg=$(slick.$slides.get(currentSlide)).find('img').attr('src').split('/').pop();
  console.log(CurrentImg)
});

我的问题是，如果我从不触摸幻灯片，就永远不会调用该事件，所以我对当前图像一无所知。

如果我只是尝试在任何 onclick 这个：

$(slick.$slides.get(currentSlide)).find('img').attr('src').split('/').pop()

当然不行，因为从来没有定义过“slick”。如果我这样做

slick = $('.slider').slick({
....

也不对，告诉我 slick.$slides 没有定义。

如果我不在活动中，我在哪里可以找到对“slick”的正确引用？谢谢

Answer 1

您可以在一个页面上有多个滑动滑块，因此要专门获取一个滑动条，您可以使用 .slick(getSlick) 获取当前滑动对象：

$('.selector .for .one .slick-slider').slick('getSlick')

如果您随后在 $slides 下查看所有幻灯片，过滤掉名称为 class slick-slide-current 的幻灯片，您就得到了所选光滑滑块的当前幻灯片。 .get(currentSlide) 这部分对我来说没用，但你应该能够过滤掉元素。

查看部分 "Methods" on the official documentation

获取当前 'slick' 滑块的图像（vanilla JS 或 jQuery）

Get the IMG of the current 'slick' slide (vanilla JS or jQuery)

javascript

slick.js