javascript - iDangerous Swiper 在 onSlideClick 后不同步

Question

我在一个页面上有两个滑动器，它们是链接和同步的。两者都是循环播放并显示大约 60 张幻灯片(长度是动态的)。两个 Swiper 都具有分页功能，并且在单击“下一个”和“上一个”按钮(.swipePrev() 和 .swipeNext())时都可以正常工作。

第一个滑动器仅显示一张大图像，第二个滑动器是带有缩略图的轮播(显示事件的幻灯片、两张上一张幻灯片和两张下一张幻灯片)。当我翻阅任一一张时，事件索引都会更新，并且事件幻灯片以小幻灯片为中心，大图像也会更新。

我现在想要添加功能，以便在单击轮播中的幻灯片时更新两个 slider 。我将以下代码添加到轮播中:

onSlideClick: function() {
    accoPager.swipeTo(accoPager.clickedSlideIndex);
    accoSlider.swipeTo(accoPager.activeIndex);
}

当我单击一次时，它工作正常，但第二次单击时，它不再工作。

有趣的是，在我使用常规寻呼机(两侧的箭头按钮)或滑动后，事件再次起作用。似乎发生的情况是，当我使用 .swipeTo() 时，事件索引未正确更新，但当我使用 .swipeNext() 或 .swipePrevious() 时，它会被纠正。

Swipers 的初始化是(首先是大的):

slider= $('#acco-slider-top').swiper({
    mode: 'horizontal',
    paginationClickable: true,
    slidesPerView: 'auto',
    loop: true,
    loopedSlides: 99,
    onTouchEnd: function () {
        pagerCarousel.swipeTo(slider.activeIndex);
    }
});

pagerCarousel = $('#pager-area .swiper-container').swiper({
    mode: 'horizontal',
    paginationClickable: true,
    slidesPerView: 'auto',
    offsetPxBefore: 144,
    loop: true,
    loopedSlides: 99,
    onTouchEnd: function () {
        slider.swipeTo(pagerCarousel.activeIndex);
    },
    onSlideClick: function() {
        pagerCarousel.swipeTo(pagerCarousel.clickedSlideIndex);
        slider.swipeTo(pagerCarousel.clickedSlideIndex);
    }
});

我尝试设置事件索引，但这不起作用。当我在 onSlideClick 事件中发出任何警报时，我发现该事件仍然链接到 Swiper，但它在 swiper 代码中的某个位置停止了。

有人对此也有任何问题吗？最好的处理方法是什么？我认为这与 Swiper 代码中的 params.onSlideClick _this.allowSlideClick 切换有关，但我无法确定到底是什么。

编辑:并非不重要，我正在使用 Swiper 2.4.2+

Answer 1

这应该可行，如果不看实例，很难说问题出在哪里。检查这个例子以及它是如何完成的，也许会有帮助 http://goo.gl/Nc2M5P