不明白为什么我的setInterval + jQuery不起作用

时间:2015-04-08 15:36:59

标签: javascript jquery setinterval

总而言之,我试图拥有一个随机引用生成器。我的代码非常简单......

var myQuotes = [

    {
    quote: "To err is human; to forgive, divine.",
    cite: "Alexander Pope"},

    {
    quote: "Reports of my death have been greatly exaggerated.",
    cite: "Mark Twain"} 

];

var randomQuote = Math.floor(Math.random() * myQuotes.length);

$('.quote').html(myQuotes[randomQuote].quote); // #1
$('.cite').html(myQuotes[randomQuote].cite); 

setInterval(function() {

    $('.quote').fadeOut();

    $('.quote').fadeIn().html(myQuotes[randomQuote].quote); // #2

}, 3000);

在加载时,它显示#1就好了,但#2似乎不起作用......它只是从前一个闪烁,即#1中的闪烁。我对此不了解什么?

1 个答案:

答案 0 :(得分:5)

你必须将randomQuote变量放在setInterval中,所以它会更新:

setInterval(function() {

    randomQuote = Math.floor(Math.random() * myQuotes.length);

    $('.quote, .cite').fadeOut("slow", function() {
        $('.quote').fadeIn("slow").html(myQuotes[randomQuote].quote);
        $('.cite').fadeIn("slow").html(myQuotes[randomQuote].cite);
    });

}, 3000);

http://jsfiddle.net/av1xg897/1/