Javascript 推特引导旋转木马，点击点1或点2激活图像，但点3或点4没有反应

我正在尝试使用带有4个图像的引导转盘。
当我点击1号或2号点时，图像会如预期的那样立即显示（ok）。 但当我点击3号或4号点时，图像不会立即显示（NOK）。 当30秒的时间到期时（确定），所有4个图像将逐个显示。 单击左箭头（或右箭头）可立即显示上一个（或下一个）图像（确定）

index.html和styles.css的源代码可以在以下位置找到：

结果（带有旋转木马的图像）可在此处看到：

如果有人能给我一个提示，我会非常感激的。我对CSS和Bootstrap比较陌生

非常感谢，并致以亲切的问候

---

Levent

我从你的小提琴上复制了这个文件，并自己试用了一下。问题在于您的html文件。数据目标中缺少一个连字符

<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active" id="carousel-indicator-li-id1"></li>
<li data-target="#carousel-example-generic" data-slide-to="1" id="carousel-indicator-li-id2"></li>
<li data target="#carousel-example-generic" data-slide-to="2" id="carousel-indicator-li-id3"></li>
<li data target="#carousel-example-generic" data-slide-to="3" id="carousel-indicator-li-id4"></li>

下面是正确的代码片段

<ol class="carousel-indicators">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active" id="carousel-indicator-li-id1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1" id="carousel-indicator-li-id2"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2" id="carousel-indicator-li-id3"></li>
        <li data-target="#carousel-example-generic" data-slide-to="3" id="carousel-indicator-li-id4"></li>
</ol>

---

它在工作你的问题是什么？问题是：但当我点击3号或4号点时，图像不会立即显示（NOK）。我假设你同意鼠标点击3号或4号点不会立即显示3号或4号图像。如果你仍然认为它工作正常，请告诉我。否则，如果有人能给我一个提示来解决这个问题，我会非常感激。谢谢，非常感谢。我还不知道在哪个位置哪个字符丢失了或者是错误的，但是你的代码现在成功了。祝你一周愉快。非常愿意帮忙。：）

<ol class="carousel-indicators">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active" id="carousel-indicator-li-id1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1" id="carousel-indicator-li-id2"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2" id="carousel-indicator-li-id3"></li>
        <li data-target="#carousel-example-generic" data-slide-to="3" id="carousel-indicator-li-id4"></li>
</ol>