如何获取轮播的总数和当前幻灯片数 [英] How to Get total and Current Slide Number of Carousel

问题描述

您能否告诉我如何在引导程序中获取轮播幻灯片的总数和当前数量，如下图所示?

Can you please let me know how I can get the total and current number of the carousel slides in bootstrap like the image below?

我有一个标准的 Bootstrap 轮播和一个带有 .num 类的 <div> 来显示总数和当前数字，我使用这个代码来检索数字但它没有通过

I have an standard Bootstrap carousel and a <div> with the .num class to display the total and current number and I used this code to retrieve the numbers but it didn't go through

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

谢谢

更新:

请在这个 jsfiddle 找到一个示例 LINK

Please find a sample at this jsfiddle LINK

推荐答案

每个 slide 都有一个 .item 类，你可以像这个

Each slide has a .item class to it, you can get the total number of slides like this

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

活动 slide 有一个名为 active 的类，你可以像这样获取 活动幻灯片 的索引

Active slide has a class named as active, you can get the index of active slide like this

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

您可以通过像这样绑定引导轮播 slid 事件来更新这些值

You can update these values by binding the bootstrap carousel slid event like this

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

示例

这篇关于如何获取轮播的总数和当前幻灯片数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！