Question

我正在测试bootstrap 2.0中的新轮播功能，并且难以使导航箭头正常运行。目前文档有点薄，我是各种各样的新手。

这是我的HTML：

<div class="span9">

<div id="myCarousel" class="carousel slide">

  <!-- Carousel items -->
  <div class="carousel-inner">

  <div class="item active">

  <img src="img/testa.jpeg">

  <div class="carousel-caption">

  <h4>First Thumbnail label</h4>
  <p>Blah Blah Blah</p>

  </div><!-- Carousel caption -->

  </div><!-- items -->

  <div class="item">

  <img src="img/testb.jpeg">

  <div class="carousel-caption">

  <h4>First Thumbnail label</h4>
  <p>Blah Blah Blah</p>

  </div><!-- Carousel caption -->

  </div><!-- items -->

  </div><!-- Carousel inner -->

  <!-- Carousel nav -->
  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>

  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>


  </div><!-- Carousel -->

</div><!-- span -->

我在javascript中激活了旋转木马：

$('#myCarousel').carousel()

这是有效的。但是，单击图像时箭头不会移动/循环显示图像。

我确信这很简单，我很想念。谢谢你的帮助。

Answer 1

我遇到了类似的问题，发现我的jQuery版本已经过时了。也许确保您运行的是最新版本，Bootstrap Docs目前正在运行1.7.1版本。更新到1.7.1后，Next和Previous按钮工作正常。

Answer 2

我遇到了旋转木马的问题，但是我让它上班了。现在我无法弄清楚如何在页面加载后自动循环显示图像。

Answer 3

你在页面中添加了过渡库吗？是插件列表中的最后一个！

Answer 4

显然这是Bootstrap 2.0.1中的一个错误。 Alexander Poslavsky在回答这个问题的另一个版本时给出的答案对我有用。

这是他的回答： https://stackoverflow.com/a/9482845/1166287

要点 - 删除或注释掉bootstrap-carousel.js中的第86行：

if (!$next.length) return

Answer 5

我在bootstrap.js中运行代码（您也可以查看bootstrap-carousel.js），这是因为如果您在列表中的最后一项上，则会返回slide方法的代码。

如果你删除它可以正常工作：

if (!$next.length) return

就像David Cochran说的那样。

Answer 6

今天有同样的问题。我的解决方案：

必须使用jQuery 1.7.1（而不是1.6.4）
必须包含bootstrap-transition.js

我的问题：如何阻止旋转木马进行自动播放

控制Twitter Bootstrap 2.0中的轮播

6 个答案: