基於DOM元素而不是索引跳轉到引導程序傳送帶中的另一張幻燈片

Question

我希望能夠跳過基於元素（例如，id或class）值的Bootstrap輪播幻燈片堆棧中的特定幻燈片而不是幻燈片如Bootstrap文檔中所述。有沒有人開發出一種優雅的方法來做到這一點，他們可以分享？

Answer 1

我不確定這是最優雅的方法，如果不希望別人會添加更好的方法。當我加載傳送帶幻燈片的數據時，我創建了一個幻燈片索引數組，與用戶想跳過的元素相對應。當用戶請求跳過元素（使用導航欄上的按鈕）時，我通過查找.active類並從當前視圖中提取html來標識當前位置。該HTML包含感興趣元素的標識符，可以使用post substring（）提取來查找幻燈片索引數組中的索引，然後在$（'＃carousel'）。carousel（index）中使用該索引。

Answer 2

下面是似乎工作體面井的解決方案的示例：

http://www.bootply.com/2VP1T6PGxW

每個滑塊具有存儲在所述元件上的data-*屬性（data-* documentation）的指標。它還具有通過後面參照的ID：

<div class="item active" id="firstSlide" data-index="0"> 

當按下按鈕時，使用jQuery找到的DOM元素和拉data-index出來，然後用bootstrap轉盤用作記載：

var index = $("#secondSlide").data('index'); 
$("#carousel-example-generic").carousel(index);