Question

我编写了一个javascript代码，每隔10秒向用户显示一个随机引用。我使用jquery更新div和setInterval来重复动作。我从javascript数组中获取一个随机引用。

但是当我测试它时，看起来，它在一段时间后不能正常工作（如3-5分钟），我有一些jquery效果，如fadeIn和fadeOut但它们在引用更改之前执行。这是js代码;

var quotes = [
    "Some String",
    "Some String",
    "Some String"
];

$(function() {
    var $rand = $('div#randomQuote > p');
    var random_quote = quotes[Math.floor(Math.random() * quotes.length)];     
    $rand.html(random_quote);
    $rand.animate( {"opacity" : 0}, 0);
    $rand.animate( {"opacity" : 1}, 500);
    $rand.delay("9000");
    $rand.animate( { "opacity" : 0 }, 500 );    
});


function randomQuote () {
    var $rand = $('div#randomQuote > p');
    var random_quote = quotes[Math.floor(Math.random() * quotes.length)]; 
    $rand.html(random_quote);
    $rand.animate( {"opacity" : 1}, 500 );
    $rand.delay("9000");
    $rand.animate ( {"opacity" : 0}, 500 );
}

$(function () {
    setInterval(randomQuote, 10000);
});

虽然我不确定，但我认为，这些线需要一些时间来计算，它会打破循环。

var $rand = $('div#randomQuote > p');
var random_quote = quotes[Math.floor(Math.random() * quotes.length)];

问：如何改进此代码以使其按预期工作？

提前致谢。

Answer 1

这样你的事件队列将无限增长。在这种情况下，您想要使用的可能是setTimeout而不是setInterval。我建议您尝试以下链接：http://ejohn.org/blog/how-javascript-timers-work/

为什么setInterval在一段时间后无法正常工作？

1 个答案: