The bootstrap 3 carousel component (Carousel) gets the index of the currently displayed picture

official documentation

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.

There are two callback methods
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.

Both callback methods can be used

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

This method uses the online .getActiveIndex() method for bootstrap 3
, which is suitable for bootsrap v3.0.2. If you cannot get it, you can try my method

write at the end

I am a pure novice, and the blog I wrote was also written because of the problems encountered in learning and use, after searching for materials and solving them. If there are errors in some places, or if there is any infringement, please contact me.

QQ: 994961015
Email: [email protected]

Guess you like

Origin blog.csdn.net/qq_37274323/article/details/92810519