在Bootstrap Carousel中跳過隱藏的幻燈片

Question

我想知道是否有辦法使用bootstrap輪播跳過隱藏的幻燈片。 我能夠使用ng-show（）顯示和隱藏幻燈片，但旋轉木馬仍然會轉到空白幻燈片。 只是想知道我是否可以為prev或next做一個功能，進入下一張幻燈片，其中ng-show（）= true？

<div class="carousel-inner" role="listbox">
  <div class="item active" ng-show="solution.check">
    <img src="img_chania.jpg" alt="Chania" width="460" height="345">
  </div>

  <div class="item" ng-show="solution.check">
    <img src="img_chania2.jpg" alt="Chania" width="460" height="345">
  </div>

  <!-- Left and right controls -->
  <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>

Answer 1

也許這可以幫助你：

在這里查看bootstrap carousel文檔

$("selector").on("slide.bs.carousel", function(){
    if($(nextslide).attr("ng-show") == false){
        // go to next element
    }
});

檢查此鏈接 。

您可以查看鏈接並查看單擊下一個或上一個按鈕時發生的情況。 該鏈接是w3schools的源，您可以“嘗試”。