Question

我有一个Twitter bootstrap 3轮播，并有一些javascript来显示当前幻灯片和旋转木马中幻灯片的数量。

我遇到的问题是，在旋转木马移动一张幻灯片之前，计数器不显示计数，然后显示正确。（例如，ist应该在加载时显示1 /（幻灯片的数量），但在您点击旋转木马导航箭头之前它不会显示任何内容。

中添加了下面的javascript代码和上下文示例

$('.carousel-stats').on('slid.bs.carousel', function () {
var carouselData = $(this).data('bs.carousel');
var currentIndex = carouselData.getItemIndex(carouselData.$element.find('.item.active'))
var total = carouselData.$items.length;

// display the count in a id with a tag for styling
var text = (currentIndex + 1) + " / " + total;
$('#carousel-index-stats').text(text);
});

我不确定错误是在我的实际代码中，还是只是在某个地方发生错误，但我已经盯着它看了一个小时，而且不是明智之举。任何帮助/指导将不胜感激。

Answer 1

您遇到语法错误，请检查documentation

您必须将活动更改为

$('.carousel-stats').on('slide.bs.carousel', function () {

正如文件所说

slide.bs.carousel   This event fires immediately when the slide instance method is invoked.
slid.bs.carousel    This event is fired when the carousel has completed its slide transition.

Bootstrap 3 Carousel上的计数器没有显示正确数量的幻灯片

1 个答案: