当前位置: 代码迷 >> 综合 >> bootstrap 3 轮播图组件(Carousel) 获取当前显示图片的索引
  详细解决方案

bootstrap 3 轮播图组件(Carousel) 获取当前显示图片的索引

热度:102   发布时间:2023-11-02 15:58:04.0

官方文档

Events
Bootstrap’s carousel class exposes two events for hooking into carousel functionality.

Both events have the following additional properties:

direction : The direction in which the carousel is sliding (either “left” or “right”).
relatedTarget: The DOM element that is being slid into place as the active item.

有两个回调方法
Event Type Description
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.

两个回调方法都可以使用

$(选择器).on('slide.bs.carousel', function (obj) {// 当前轮播索引var index = $(this).find('.item').index(obj.relatedTarget);console.log("索引:" + index);});

此方法针对bootstrap 3使用
网上的.getActiveIndex()方法,适用于bootsrap v3.0.2,如果出现无法获取的情况可以试试我这个方法

写在最后

本人为纯小白,所写的博客也是因为学习使用中遇到的问题进行查找资料然后解决后才编写的,其中如果有某些地方有错误,或者涉及侵权的请联系我,

QQ : 994961015
E-mail: yangxj96@126.com