Javascript 如何将.each()与flickity一起使用以仅影响活动flickity实例
我试图将iframe定位在flickity活动实例中,因为我可能在一个页面上有多个flickity实例(最终目标是刷新用户选择另一张幻灯片后刚刚查看的幻灯片中的iframe) 我用它来制作一个幻灯片,但是当我在页面上有多个幻灯片时会遇到问题,因为它会刷新以前选择的所有iFrame,而不仅仅是活动幻灯片中的iFrame 下面是我的脚本,“.slideshow”是一个flickity实例,我希望能够在一个页面上有多个。这个问题与锁定正确的“previousVideoContainer”有关,其父级刚刚触发了“settle.flickity”事件。有什么想法吗Javascript 如何将.each()与flickity一起使用以仅影响活动flickity实例,javascript,jquery,flickity,Javascript,Jquery,Flickity,我试图将iframe定位在flickity活动实例中,因为我可能在一个页面上有多个flickity实例(最终目标是刷新用户选择另一张幻灯片后刚刚查看的幻灯片中的iframe) 我用它来制作一个幻灯片,但是当我在页面上有多个幻灯片时会遇到问题,因为它会刷新以前选择的所有iFrame,而不仅仅是活动幻灯片中的iFrame 下面是我的脚本,“.slideshow”是一个flickity实例,我希望能够在一个页面上有多个。这个问题与锁定正确的“previousVideoContainer”有关,其父级刚
$('.slideshow').each(function(index, element) {
// in case the first slide is a video
var previousVideoContainer = $(this).find('.slideshow-cell.is-selected iframe');
$(this).on('settle.flickity', function () {
//reload iframe in previously viewed slide to "stop" the video
$(previousVideoContainer).each(function(ev) {
var video = this;
$($(video),parent.document).attr('src',$($(video),parent.document).attr('data-src'));
});
var videoContainer = $('.carousel-cell.is-selected iframe');
previousVideoContainer = videoContainer;
});
});
我回答了我自己的问题。问题在于,我没有像对待上一个videoContainer那样对“videoContainer”变量进行范围限定。Flickity工作得很好。以下是修订后的代码:
$('.slideshow').each(function(index, element) {
// in case the first slide is a video
var previousVideoContainer = $(this).find('.slideshow-cell.is-selected iframe');
$(this).on('settle.flickity', function () {
//reload iframe in previously viewed slide to "stop" the video
$(previousVideoContainer).each(function(ev) {
var video = this;
$($(video),parent.document).attr('src',$($(video),parent.document).attr('data-src'));
});
var videoContainer = $(this).find('.slideshow-cell.is-selected iframe');
previousVideoContainer = videoContainer;
});
});