BootStrap 獲得輪播中的索引和當(dāng)前活動(dòng)的焦點(diǎn)對(duì)象
今天用bootstrap做一個(gè)輪播，當(dāng)輪播滾到每張圖的時(shí)候，在頁(yè)面下面就顯示相對(duì)應(yīng)的內(nèi)容，那么問(wèn)題來(lái)了：為了輪播圖的可擴(kuò)展性，我們肯定需要知道當(dāng)前活動(dòng)（顯示圖片）的索引號(hào)，查了bootstrap文檔，文檔上并沒(méi)有直接提及（最新版的Bootstrap v3.3.7 ），但是在官網(wǎng)其實(shí)也簡(jiǎn)單有說(shuō)明：
在網(wǎng)絡(luò)上找到的一個(gè).getActiveIndex()方法，他適應(yīng)于bootsrap v3.0.2，但是這個(gè)版本已經(jīng)不能用了，所以就不再舉例了。
還有的博主說(shuō)可以擴(kuò)展成這樣
$('#myCarousel').on('slide.bs.carousel', function () {
var carouselData = $(this).data('bs.carousel').$active;
});
但是對(duì)于很多人來(lái)說(shuō)這些將的并不是他們說(shuō)需求的，而且.$active 只是在點(diǎn)擊圓點(diǎn)的時(shí)候才會(huì)觸發(fā)，自動(dòng)播放是值是空的。
所以在網(wǎng)上找了很多方法其實(shí)都不能用于是自己花了點(diǎn)時(shí)間仔細(xì)看了bootstrap文檔將代碼改好了
$('#myCarousel').on('slide.bs.carousel', function (event) {
var $hoder = $('#myCarousel').find('.item'),
$items = $(event.relatedTarget);
//getIndex就是輪播到當(dāng)前位置的索引
var getIndex= $hoder.index($items);
})
注意：索引都是從0開(kāi)始的；然后還有很多可以改進(jìn)的地方大家可以打印參數(shù)event里面有很多有用的值
相關(guān)文章
下面小編就為大家?guī)?lái)一篇淺談JavaScript中的分支結(jié)構(gòu)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-07
JavaScript中高級(jí)語(yǔ)法??表達(dá)式用法示例詳解
這篇文章主要為大家介紹了JavaScript中高級(jí)語(yǔ)法??表達(dá)式用法示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-04-04
Echarts實(shí)例教程之樹(shù)形圖表的實(shí)現(xiàn)方法
眾所周知echarts是一個(gè)純JavaScript的圖標(biāo)庫(kù),下面這篇文章主要給大家介紹了關(guān)于Echarts實(shí)例之樹(shù)形圖表的實(shí)現(xiàn)方法,需要的朋友可以參考下2021-08-08
本篇文章主要是對(duì)js處理自己不能定義二維數(shù)組的方法進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望讀大家有所幫助2014-03-03
js+canvas實(shí)現(xiàn)網(wǎng)站背景鼠標(biāo)吸附線條動(dòng)畫(huà)
這篇文章主要為大家詳細(xì)介紹了js+canvas實(shí)現(xiàn)網(wǎng)站背景鼠標(biāo)吸附線條動(dòng)畫(huà)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
javascript中的數(shù)字與字符串相加實(shí)例分析
javascript中的數(shù)字與字符串相加實(shí)例分析，學(xué)習(xí)js的朋友可以參考下。2011-08-08
使用window.postMessage()方法在兩個(gè)網(wǎng)頁(yè)間傳遞數(shù)據(jù)
這篇文章介紹了使用window.postMessage()在兩個(gè)網(wǎng)頁(yè)間傳遞數(shù)據(jù)的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-06-06
這篇文章主要介紹了JavaScript獲得指定對(duì)象大小的方法,涉及javascript針對(duì)元素遍歷與屬性操作的相關(guān)技巧,需要的朋友可以參考下2015-07-07
這篇文章主要為大家介紹了JavaScript稀疏數(shù)組與孔hole示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-06-06
JS動(dòng)態(tài)修改圖片的URL（src）的方法
這篇文章主要介紹了JS動(dòng)態(tài)修改圖片的URL（src）的方法,涉及javascript操作圖片src屬性的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-04-04