0

我正在使用iDangerous Swiper库与Jquery Mobile框架一起显示移动滑动触摸画廊。它工作正常，除非我离开索引页面（画廊所在的位置）然后回来，分页小部件无法正常工作。它仍然出现（我可以看到项目符号），并且它仍然是可点击的，即如果我“触摸”一个项目符号，画廊会滑动到相应的幻灯片并且项目符号变为“活动”，但它不能以相反的方式工作，在换句话说，它不会响应幻灯片更改：如果我在幻灯片中滑动，则当前活动的项目符号不会更新。

这是初始化代码：

$( document ).on( "pageshow", "#index-page", function( event ) {

    var mySwiper = new Swiper('.swiper-container',{
        pagination: '.pagination',
        paginationClickable: true,
        slidesPerView: 'auto'
    });

});

该页面与 jquery mobile 的data-ajax="true"属性链接以保留全局范围。

4

2 回答 2

0

它帮助我分页 swiper idangerous jquery mobile

$(document).one("pageshow", "#page1", function (e) {
        var swiper = new Swiper('.swiper-container', {
        paginationClickable: true,
        hashnav: true,
        pagination: '.swiper-pagination',
        hashnav: true });       
    function reinitSwiper(swiper) {
      setTimeout(function () {
       swiper.reInit();
      }, 500);
    }
});
于 2015-03-27T03:46:24.097 回答
0

问题： 初始化刷卡器两次。

解决方案： 在“pageshow”事件之外定义一个全局变量“swiper”。第一次加载画廊时，全局变量“swiper”将是“未定义的”。当您离开页面并返回时，全局变量“swiper”不会“未定义”。然后不要再次初始化。

<script>
    var swiper;

    $(document).on("pageshow", "#page1", function (e) {
        if (swiper == undefined) {
            swiper = new Swiper('.swiper-container', {
                pagination: '.pagination',
                paginationClickable: true,
                slidesPerView: 'auto'
            }); 
        }
    });
</script>
于 2021-07-31T20:38:08.907 回答