【问题标题】：cycle a text in jquery over time [closed]随着时间的推移在jquery中循环文本[关闭]
【发布时间】：2013-05-25 23:00:06
【问题描述】：

我有分散的帮助需求。 :)

我需要制作一个 jquery 脚本，其中一个文本显示在一个 div 中，并在一段确定的时间内进行更改。因此，例如每 7 秒 div 内容更改一次（我还必须插入淡入淡出效果）。所以我写了这段代码，但它不起作用

var caption = [
"Tip 01",
"Tip 02",
"Tip 03",
"Tip 04",
"Tip 05",
];

setInterval(function() {
    jQuery.each(caption, function() {
        $("#message-box").html(caption[i]);
    });
    }, 7 * 1000);

我哪里错了？所有这一切都是因为超大插件不支持图像上的标题，所以我必须以这种方式手动执行此操作。

message-box 是显示 che 数组项的 div。

提前感谢您的帮助

【问题讨论】：

标签： javascript jquery time setinterval

【解决方案1】：

这样使用

var i = 0;
setInterval(function() {       
$("#message-box").html(caption[i]);
i++;
if (i == caption.length){i=0;}
}, 7 * 1000);

See Demo

【讨论】：

为什么是 "i == caption.length" ？为什么不是模数？ var l = 标题.长度；并且您可以像标题[i%l] 一样访问它
为什么要使用模数？你给的条件检查有什么不同？？
它有效！谢谢，但为什么它会在 7 秒后开始？当网站加载时，直到前 7 秒才会显示任何内容
@user1071936 将您的代码更改为您想要的。看这里jsfiddle.net/Dineshkani/X8uXN/1
为什么如果我使用fadeToggle，数组的内容首先显示然后淡出然后淡入？

【解决方案2】：

这样试试

var caption = ["Tip 01", "Tip 02", "Tip 03", "Tip 04", "Tip 05"];
var l = caption.length; // array length (here 5)
var i = 0; // set to 0 (array index starts at 0)

setInterval(function () {
    if (i > l) i = 0; 
    // when i is bigger than the total values in the array set it back to 0
    $("#message-box").html(caption[i]); // insert text from array
    i++; // add + 1 to i
}, 7000);

$.each() 将直接显示数组中的最后一个值，并且不会在它们之间切换

【讨论】：

谢谢，但即使在 jfiddle 上也不起作用
@user1071936 是的，该数组有一个额外的 , 导致代码中断。我现在修好了