1
有没有一种方法来对单独一个页面工作，而ID的多个通用引导旋转木马？目前，这两个转盘在工作，但是当我点击上一页/下一页那么它同时改变转盘。我会认为这会针对旋转木马点击？多引导旋转木马，而不标识？
谢谢！
HTML
<div class="carousel slide" data-ride="carousel" data-wlp-component="wlp.carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target=".carousel" data-slide-to="0" class="active"></li>
<li data-target=".carousel" data-slide-to="1"></li>
<li data-target=".carousel" data-slide-to="2"></li>
<li data-target=".carousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image1">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image2">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image3">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image4">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href=".carousel" 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=".carousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<!-- Second Carousel -->
<div class="carousel slide" data-ride="carousel" data-wlp-component="wlp.carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target=".carousel" data-slide-to="0" class="active"></li>
<li data-target=".carousel" data-slide-to="1"></li>
<li data-target=".carousel" data-slide-to="2"></li>
<li data-target=".carousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image1">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image2">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image3">
</div>
<div class="item">
<img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=960%C3%97370&w=960&h=370" alt="Image4">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href=".carousel" 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=".carousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
JS
$('.carousel').each(function(){
$(this).carousel({
interval: 3000
});
$(this).on('click', '.left', function(){
$(this).carousel('prev');
});
$(this).on('click', '.right', function(){
$(this).carousel('next');
});
});
引导将其连接'onclick'听众'.left'和'默认.right'（你可以看到他们从检查员/开发者控制台），我相信这是你的JS代码无法达到预期效果的原因。您可以尝试使用jQuery的'.off（）'方法删除默认处理程序。 – Kairat
@Kairat我看到你说的话。我很好奇，如果有发现特定父.carousel的方式 – Fawn