Bootstrap carousel next和prev功能不起作用

Question

使用最新版本并具有基本的旋转木马.我已经使用了所有默认设置,但是当尝试添加或停止某些功能时,事情会中断或根本不起作用.我希望能够手动循环图像.不要让它自动循环.我想只使用next和prev按钮来循环.我在这里读了几篇文章,但解决方案不起作用帮助/工作.

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

<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item">
     <ul class="thumbnails">
         <li>Img</li>
         <li>Img</li>
         <li>Img</li>
     </ul>
</div>
<div class="item">
      <ul class="thumbnails">
         <li>Img</li>
         <li>Img</li>
         <li>Img</li>
     </ul>
</div>
</div>
<!-- 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>

$('#myCarousel').each(function() {
    $(this).carousel({
        interval: false
    });
});

Answer 1

您可以自己连接事件:

$('.carousel-control.left').click(function() {
  $('#myCarousel').carousel('prev');
});

$('.carousel-control.right').click(function() {
  $('#myCarousel').carousel('next');
});

你当然也可以使用data-slide它取决于你想做什么.像这样的东西和上面一样.

$('a[data-slide="prev"]').click(function() {
  $('#myCarousel').carousel('prev');
});

$('a[data-slide="next"]').click(function() {
  $('#myCarousel').carousel('next');
});