使用bootstrap之轮播插件不自动播放的问题和播放时间间隔的问题解决方法

在学习一个开源的工具之前，必做的是去官网下载官方文档，并且阅读官方文档的内容。笔者使用

版本为bootstrap-3.3.7

的轮播插件，是直接粘贴官方文档中的代码，但发现图片不会自动轮播。代码如下：

<div id="myCarousel" class="carousel slide">
<!-- 轮播（Carousel）指标 -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>   
<!-- 轮播（Carousel）项目 -->
<div class="carousel-inner">
<div class="item active">
<img src="/wp-content/uploads/2014/07/slide1.png" alt="First slide">
</div>
<div class="item">
<img src="/wp-content/uploads/2014/07/slide2.png" alt="Second slide">
</div>
<div class="item">
<img src="/wp-content/uploads/2014/07/slide3.png" alt="Third slide">
</div>
</div>
<!-- 轮播（Carousel）导航 -->
<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> 

此时轮播的图片会一直显示为第一张，不会自动播放，需要手动点击下一张。它才会自动播放。想要自动播放需要增加如下代码：

<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="2500">
<!-- 轮播（Carousel）指标 -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>   
<!-- 轮播（Carousel）项目 -->
<div class="carousel-inner">
<div class="item active">
<img src="/wp-content/uploads/2014/07/slide1.png" alt="First slide">
</div>
<div class="item">
<img src="/wp-content/uploads/2014/07/slide2.png" alt="Second slide">
</div>
<div class="item">
<img src="/wp-content/uploads/2014/07/slide3.png" alt="Third slide">
</div>
</div>
<!-- 轮播（Carousel）导航 -->
<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> 

其中data-ride="carousel"设置为自动播放，data-interval="2500"可以调整轮播时间间隔。

----------------------------------------望本文对读者有所帮助。