mySwiper 未使用 jquery 和 cordova 定义

mySwiper is not defined with jquery and cordova

我使用 cordova 和 jquery,我尝试使用 idangero 的 Swiper。

我试过这样做:

$(document).ready(function () {
    //initialize swiper when document ready
    var mySwiper = new Swiper ('.swiper-container', {
    // Optional parameters
    autoplay: ‘3000’,
    loop: true
    })
});

但是当我在这部分调用它时:

$(document).on('pagebeforeshow', ‘#listDetail’, function(){
    … some codes …
    if(row.pictures != ''){
        var numslide = mySwiper.slides.length;
        mySwiper.appendSlide(slidecontent);
        for (var i = 0; i < numslide; i++) {
            mySwiper.removeSlide(0);
        }
        mySwiper.updateSlidesSize();
    }else{
        mySwiper.removeAllSlides();
    }
    … some codes …
});

我有这个 Uncaught ReferenceError: mySwiper is not defined 消息。

有什么想法吗?

谢谢

您需要在初始化之前定义 mySwiper 以便它可以在 $(document).ready 函数范围之外使用

var mySwiper;
$(document).ready(function () {
    //initialize swiper when document ready
    mySwiper = new Swiper ('.swiper-container', {
        // Optional parameters
        autoplay: ‘3000’,
        loop: true
    })
});

或者,您可以像这样在其他事件中获取 Swiper 实例:

$(document).on('pagebeforeshow', ‘#listDetail’, function(){
    … some codes …
    if(row.pictures != ''){
        var mySwiper = $('.swiper-container')[0].swiper;
        var numslide = mySwiper.slides.length;
        mySwiper.appendSlide(slidecontent);
        for (var i = 0; i < numslide; i++) {
            mySwiper.removeSlide(0);
        }
        mySwiper.updateSlidesSize();
    }else{
        mySwiper.removeAllSlides();
    }
    … some codes …
});