带有动态项目的Bootstrap Carousel不会滑动

Question

我正在使用股票引导转盘:

<div id="main-navigation-carousel" class="carousel slide">
  <div class="carousel-inner">
    <div class="item active" data-id="0">
      <ul>
        <li><a></a></li>
        ....
        <li><a></a></li>
      </ul>
    </div>
  </div>
</div>

通过点击旋转木马内的锚标签,一个新.item的注入到.carousel-inner.后.item注入(工作正常)转盘应滑落到.item.然而,没有任何反应.

<div id="main-navigation-carousel" class="carousel slide">
  <div class="carousel-inner">
    <div class="item active" data-id="0">
      <ul>
        <li><a></a></li>
        ....
        <li><a></a></li>
      </ul>
    </div>
    <div class="item" data-id="1">
      <ul>
        <li><a></a></li>
        ....
        <li><a></a></li>
      </ul>
    </div>
    <div class="item" data-id="2">
      <ul>
        <li><a></a></li>
        ....
        <li><a></a></li>
      </ul>
    </div>
  </div>
</div>

即使我$("#main-navigation-carousel").carousel(1);在浏览器控制台中使用也没有任何反应.如果我在服务器上的代码中添加项目一切正常.

Answer 1

删除轮播数据然后再次触发它就可以完成这项工作!

$("#main-navigation-carousel").carousel("pause").removeData();
$("#main-navigation-carousel").carousel(target_slide_index);

由于旋转木马不应自动滑动,因此使用非常重要.carousel("pause").removeData().