jQuery不会更改CSS颜色值…有时

Question

我遇到的问题是，我正在构建一种幻灯片显示，并且在发生特定行为后，即使所有部分都可以正常显示，用于突出显示（将幻灯片编号的颜色从绿色更改为红色）的代码也无法正常工作其他情况。

我的示例位于此链接上，供您查看。 让幻灯片播放5张幻灯片。 一切正常（显示幻灯片时数字突出显示）。 当您单击一个数字时，它仍然有效，然后在8秒钟的暂停后将继续播放幻灯片。 现在，当您单击“新的阻止”文本并单击回到“新闻和事件”文本时，就会发生问题。 应该发生的情况是，幻灯片放映应从幻灯片1开始（数字1为红色），但数字1保持绿色。 当幻灯片更改时，数字2保持绿色。 幻灯片再次更改，并且3保持绿色。 幻灯片再次更改，并且4变成红色。 与幻灯片5相同。

我已利用自己的知识，准备将其余的头发撕掉。 请帮忙！

Answer 1

您的示例有一些断开的链接，对于初学者而言，请尝试修复jquery UI的URL，它们分别为10.2.24.111/js/jquery-ui-1.9.0.custom.min.js和10.2.24.111/css/smoothness/jquery -ui-1.9.0.custom.css。

我弄清楚了为什么链接对于1-3无效，而对于4和5无效。

这是因为每个幻灯片的ID分别为id =“ 1”，id =“ 2”等，因此，一旦加载第二张幻灯片（只有3张幻灯片），现在页面上就会有两个幻灯片相同的ID 1,2和3。

因此，解决方法是更改​​每个链接，如下所示：

<a href="#theFeeds" class="promoNav" id="1">1</a>

要具有这样的前缀：

<a href="#theFeeds" class="promoNav" id="feeds_1">1</a>

这样您就不会在同一页面上有重复的ID。