我正在尝试编写 Bootstrap 轮播，那里的照片会像它们应该的那样自动更改，但是当我尝试单击一张照片时，指示器、轮播底部的点不会更改照片。有人可以帮忙吗？我试图到处寻找。
jQuery 包含在 bootstrap.js 之上，但如果是这样，轮播就不会更改照片，对吧？照片正在变化，但指示器不起作用，这很奇怪。
<head>
<meta charset="utf-8">
<title>Ag</title>
<meta name="vievport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script src="bootstrap-3.3.6-dist/js/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.6-dist/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.6-dist/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" type="text/css" href="css/own.css">
</head>
<body>
<div id="sliderSyrenka" class="carousel slide" data-ride="carousel">
<!-- INDICATORS-->
<ol class="carousel-indicators">
<li data-target="#sliderSyrenka" data-slide-to:"0" class="active"></li>
<li data-target="#sliderSyrenka" data-slide-to:"1"></li>
<li data-target="#sliderSyrenka" data-slide-to:"2"></li>
<li data-target="#sliderSyrenka" data-slide-to:"3"></li>
</ol>
<!-- WRAPPER FOR SLIDES-->
<div class="carousel-inner" >
<div class="item active">
<img src="img/slider/slide0.jpg" alt="" >
</div>
<div class="item">
<img src="img/slider/slide1.jpg" alt="" >
</div>
<div class="item">
<img src="img/slider/slide2.jpg" alt="" >
</div>
<div class="item">
<img src="img/slider/slide3.jpg" alt="" >
</div>
</div>
</div>
</body>
最佳答案
您的语法错误:data-slide-to:
只需将 : 替换为 = ，轮播指示器就可以完美工作:)
更正了轮播指示器:
<!-- INDICATORS-->
<ol class="carousel-indicators">
<li data-target="#sliderSyrenka" data-slide-to="0" class="active"></li>
<li data-target="#sliderSyrenka" data-slide-to="1"></li>
<li data-target="#sliderSyrenka" data-slide-to="2"></li>
<li data-target="#sliderSyrenka" data-slide-to="3"></li>
</ol>
关于javascript - 单击时 Bootstrap 轮播指示器不会更改照片 ()，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36390031/