0

我有一个页面,其中包含多个内容滑块(使用 jQuery bxSlider)和一个单页计数器。每个滑块都包含在一个可折叠的 div 中,使用 3 个按钮控制其打开和关闭。

这可以在这里工作 - jsFiddle

打开新滑块时,该滑块的幻灯片总数未正确显示。使用(注释掉的)警报,我可以看到 show.getSlideCount 依次为三个滑块中的每一个返回,因此始终以 3 结束(三个滑块中最后一个滑块的数量)。当您单击下一个箭头查看第二张幻灯片时,每个滑块的总页数会正确显示。

我确信这是非常明显的事情,但我似乎无法弄清楚为什么幻灯片计数对于下一个和上一个幻灯片功能正常工作,但不适用于滑块加载。这是我用于 bxSlider 的脚本

$('.bxslider').each(function(){
    var show = $(this);

    show.bxSlider({
    pager: false,
    infiniteLoop: false,
    hideControlOnEnd: true,
    slideMargin: 350,
    onSliderLoad: function (){
        show.goToSlide(0);
        var slide_count = show.getSlideCount();
        var slide_curr = show.getCurrentSlide();
        // alert (slide_count);
        insertCount(slide_curr,slide_count);
    },
    onSlideNext: function (){
        var slide_count = show.getSlideCount();
        var slide_curr = show.getCurrentSlide();
        insertCount(slide_curr,slide_count);
    },
    onSlidePrev: function (){
        var slide_count = show.getSlideCount();
        var slide_curr = show.getCurrentSlide();
        insertCount(slide_curr,slide_count);
    }                               
    });             
});

任何帮助或建议将不胜感激。

4

1 回答 1

1

您可以使用内置计数器,而不是为 bxslider 构建自己的 n/x 计数器:

$('.bxslider').bxSlider({
    pager: true,
    pagerType: 'short'
});
于 2013-11-06T08:39:12.263 回答