在setInterval javascript中，文本在几分钟后开始闪烁

Question

我正在制作一个div，在setInterval函数的帮助下，每10秒更改一次文本。它运行良好，但 5-6 分钟后它开始在毫秒内更改其文本，因此看起来就像在闪烁。

我的代码是：

var wordArray = ["TEXT1","TEXT2","TEXT3"];
function typingEffect() {
    var rand = Math.floor(Math.random()*3);
    $("#big-bob h5").text(wordArray[rand]);
    $("#big-bob h5").addClass("animate");
    setInterval(typingEffect,10000);
}
typingEffect();

Answer 1

每次

执行typingEffect()函数时都会创建一个新的间隔...

var wordArray = ["TEXT1","TEXT2","TEXT3"];
function typingEffect() {
    var rand = Math.floor(Math.random()*3);
    $("#big-bob h5").text(wordArray[rand]).addClass("animate");
}
setInterval(typingEffect,10000);
typingEffect(); // This last line is only needed if you want to execute the function
                // when page loads (otherwise, first execution will be after the
                // first 10 seconds)

要以自己的方式做到这一点，您应该使用setTimeout()...

var wordArray = ["TEXT1","TEXT2","TEXT3"];
function typingEffect() {
    var rand = Math.floor(Math.random()*3);
    $("#big-bob h5").text(wordArray[rand]).addClass("animate");
    setTimeout(typingEffect,10000);
}
typingEffect();