如何获取轮播的总数和当前幻灯片数

Question

你能告诉我如何获得引导程序中旋转木马滑块的总数和当前数量,如下图所示吗？

我有一个标准的引导轮播和<div>与.num类显示的总电流的号码,我用这个代码检索数字,但它并没有去通过

$('.num').html(){
  $('#myCarousel').carousel({number})
}

谢谢

更新:

请在这个jsfiddle LINK上找到一个样本

Answer 1

每个slide都有一个.item类,你可以得到像这样的幻灯片总数

var totalItems = $('.item').length;

活动slide有一个命名为类active,你可以得到的指数active slide是这样

var currentIndex = $('div.active').index() + 1;

您可以通过绑定bootstrap carousel slid事件来更新这些值

$('#myCarousel').bind('slid', function() {
    currentIndex = $('div.active').index() + 1;
   $('.num').html(''+currentIndex+'/'+totalItems+'');
});

例

Answer 2

的@Khawer择善代码更新

对于引导3.0+使用slid.bs.carousel代替slid和on代替的bind.所以更新代码就是这样的

var totalItems = $('.item').length;
var currentIndex = $('div.active').index() + 1;

$('#myCarousel').on('slid.bs.carousel', function() {
    currentIndex = $('div.active').index() + 1;
   $('.num').html(''+currentIndex+'/'+totalItems+'');
});

Answer 3

var totalItemsPop = $('#Mycarousel .item').length; 
$('#Mycarousel').on('slide.bs.carousel', function() {
       setTimeout(function(){ 
            currentIndexPop = $('#Mycarousel div.active').index() + 1;
            $('.num').html('' + currentIndexPop + '/' + totalItemsPop + '');
         }, 1000);
   });

滑动事件后，div 将处于活动状态并且无法获得活动索引，因此请将您的代码保留在设置超时功能中