BxSlider destroySlider() 函数不起作用:滑块未定义或不是函数

BxSlider destroySlider() function not working: slider undefined or is not a function

我使用 bxslider 在轮播中显示了一堆帖子。触发轮播的代码如下所示:

jQuery(document).ready(function() {

var carouselWidth = 640;
var carousel;
var carousel_Config = {
          minSlides: 1,
          maxSlides: 5,
          slideWidth: 285,
          slideMargin: 25,
          controls: false,
          pagerSelector: '.pager'
}

    if( jQuery(window).width() > carouselWidth) {
        carousel = jQuery('.event-carousel').bxSlider(carousel_Config);
    };

    jQuery(window).resize(function() {
        if( jQuery(window).width() > carouselWidth) {
            carousel = jQuery('.event-carousel').bxSlider(ttCarousel_Config);
        } else {
            carousel.destroySlider();
        }
    });

});

简单吧?

问题是 destroySlider() 不起作用:我知道 "carousel" 未定义。如果我尝试使用也是一样的:

jQuery('.event-carousel').bxSlider().destroySlider();

我试图在 jQuery(document...) 之外声明 "carousel" putting var carousel;在脚本顶部,但我总是在控制台中得到相同的结果:旋转木马未定义。

我该如何解决这个问题?

你能试试下面的代码吗:

jQuery(document).ready(function() {

var carouselWidth = 640;
var carousel = null;
var carousel_Config = {
          minSlides: 1,
          maxSlides: 5,
          slideWidth: 285,
          slideMargin: 25,
          controls: false,
          pagerSelector: '.pager'
}

    if( jQuery(window).width() > carouselWidth) {
        if(carousel == null)
            carousel = jQuery('.event-carousel').bxSlider(carousel_Config);
    };

    jQuery(window).resize(function() {
        if( jQuery(window).width() > carouselWidth) {
            if(carousel == null)
                carousel = jQuery('.event-carousel').bxSlider(ttCarousel_Config);
            else
                carousel.reloadSlider(); //reloading the slider if already instance present
        } else {
            if(carousel){
                carousel.destroySlider();
                carousel = null;
            }
        }
    });

});

销毁前请检查 carousel 对象。同样适用于初始化 carousel。如果它已经存在,则无需 create/re-init 旋转木马。