引导轮播冻结答案

【问题标题】：Bootstrap carousels freezing up引导轮播冻结
【发布时间】：2020-07-02 04:31:14
【问题描述】：

我之前问过一个关于多个引导轮播的问题，并且从 Stack Overflow 用户那里收到了一个非常好的代码。

我使用的是用户提供的相同代码。但问题是当页面长时间保持打开状态时，轮播会冻结。

冻结我的意思是第一个滑块，在指定的时间间隔后停止滑动。如果我手动单击导航按钮，它会滑动。

对于第二个轮播和缩略图，问题是当我单击缩略图时，相应的图像没有显示在第二个轮播中。

再多的刷新或复制粘贴代码到页面也无济于事。

我的页面上显然还有其他元素，但没有一个具有 jquery 或类似的类名。因此排除了类名或 id 名的重叠。

问题出在哪里？

我们将不胜感激任何形式的帮助。谢谢。

【问题讨论】：

刚刚注意到，在您的第二个轮播中，您想要显示（额外）的缩略图图像具有相同的 id，在元素上使用 id 应该是相同的，尤其是当您给它们一些操作或修改时在你的脚本中。检查这个：imgur.com/a/MiBc5
@jhek 即使我没有点击额外的，问题仍然存在。如果我点击一、二、三、四或五，我将面临同样的事情。
这很奇怪，我在这里试过你的代码，看看这个。 jsfiddle.net/tqtva7r2/1 我发现唯一不起作用的是那些“额外”图像。
@jhek 它最初工作正常。只有当页面打开很长时间时，它们才会冻结。这是最奇怪的事情。
你的意思是“真的很长”多长时间？你试过检查你是控制台吗？有什么错误吗？顺便说一句，你能编辑你的帖子并包括你到底有什么代码，顺便说一句你打算使用多少个滑块？

【解决方案1】：

在这里，当我查看您的 jsfiddle 时，您的代码中缺少 });，这是此 jQuery(document).ready(function($) { 的终止符。现在检查 jsfiddle here。

【讨论】：

【解决方案2】：

在第一行代码添加“数据间隔”

<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="3000"></div>

1000 是 1 秒，3000 是 3 秒。您可以将“3000”替换为您想要的滑块速度。

【讨论】：