2015-09-07 36 views
1

你好,我想在bootstrap中獲得當前幻燈片的轉盤數量3.3.4我已經在下面的3版本中使用過這個腳本, 0.4沒有工作的任何一個可以幫助我擺脫這種局面提前 日Thnx 代碼是用如何在Bootstrap中獲取當前幻燈片的轉盤總數3.3.4

var totalItems = $('.item').length; 
 
var currentIndex = $('div.active').index() + 1; 
 
$('.num').html(''+currentIndex+'/'+totalItems+''); 
 

 
$('#myCarousel').carousel({ 
 
    interval: 2000 
 
}); 
 

 
$('#myCarousel').bind('slid', function() { 
 
    currentIndex = $('div.active').index() + 1; 
 
    $('.num').html(''+currentIndex+'/'+totalItems+''); 
 
});
.container { 
 
    margin-top: 10px; 
 
} 
 
.num{ 
 
    background:#000; 
 
    color:#fff; 
 
    padding:10px; 
 
    width:50px; 
 
    text-align:center; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
 
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" rel="stylesheet"/> 
 
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="container"> 
 
    <div class="well span9 columns"> 
 
     <div id="myCarousel" class="carousel slide"> 
 
      <div class="carousel-inner"> 
 
       <div class="item active"> 
 
        <img src="http://bootstrapdocs.com/v2.0.3/docs/assets/img/bootstrap-mdo-sfmoma-01.jpg" alt="" /> 
 
       </div> 
 
       <div class="item"> 
 
        <img src="http://bootstrapdocs.com/v2.0.3/docs/assets/img/bootstrap-mdo-sfmoma-02.jpg" alt="" /> 
 
       </div> 
 
       <div class="item"> 
 
        <img src="http://bootstrapdocs.com/v2.0.3/docs/assets/img/bootstrap-mdo-sfmoma-03.jpg" alt="" /> 
 
       </div> 
 
      </div> 
 
      <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a> 
 
      <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> 
 
     </div> 
 
    </div> 
 
</div> 
 

 
<div class="num"></div>

,但是當我在使用版本3.3.4也沒有工作,請請幫助我

回答

1

試試這個:

$('#myCarousel').on('slide.bs.carousel', function() { 
    currentIndex = $('div.active').index() + 1; 
    $('.num').html(''+currentIndex+'/'+totalItems+''); 
}); 
+0

日Thnx哥們,你能不能幫我多一點,現在它開始/ 3和下一張幻燈片顯示它的1/3,並在最後一張幻燈片顯示它的2/3,但我希望它從1/3開始,最後滑動顯示3/3 plx幫我解決這個問題 – Dami

+0

當然,我可以幫助你,但沒有得到解決。當我運行代碼片段時,它以1/3開始,最後一個已經是3/3。我錯了嗎? – guvenckardas

+0

是的,你是正確的,從1/3開始,結束於3/3,但這在我的代碼片段中工作,它在3.0.0版本上運行,但是當我在版本3.3.4上運行腳本時,它從/ 3開始並結束在2/3處,你可以在代碼片段中向我展示你的腳本。 – Dami

相關問題