javascript - 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();