多个bootstrap轮播相同的页面

Question

目前我在一个页面上有3个bootstrap轮播。

它们是由一个我无法控制的php循环生成的，所以id总是从carousel开始。

所以我遇到的问题是所有的轮播开始于id="#carousel-1"并控制href="#carousel-1"

当然这不起作用，因为所有的旋转木马都会滚动第一个旋转木马我意识到这不会工作所以我想添加

$('.second-block #carousel').attr("id","#carousel-2").find('.controls a').attr("href","#carousel-2");
$('.fourth-block #carousel').attr("id","#carousel-3").find('.controls a').attr("href","#carousel-3");

这个jquery可以解决问题，因为它将其他轮播的id更改为自己的，但不幸的是，这仍然只是滑动转盘第一。有什么想法吗？

这是Codepen

Answer 1

您必须更改id，.carousel-control的{​​{1}}元素。根据{{​​3}}：

  

id属性

     

id属性指定其元素的唯一标识符（ID）。该   value必须在元素的主子树中的所有ID中唯一   并且必须至少包含一个字符。该值不得包含   任何空格字符。

请检查：W3

.carousel