Question

我使用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（文档...）之外声明“carousel”放置var carousel;在脚本的顶部，但我总是在控制台中获得相同的结果：Carousel未定义。

我该如何解决这个问题？

Answer 1

请尝试使用以下代码：

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。如果它已经存在则无需创建/重新启动轮播。

BxSlider destroySlider（）函数不起作用：slider undefined或不是函数

1 个答案: