在json调用上设置间隔以重新加载新图像

我试图设置从Flickr API重新加载新图像的时间间隔。在json调用上设置间隔以重新加载新图像

我需要添加什么才能使页面使用setInterval来抓取新图像。

这是我的代码：

$(document).ready(function(){ 
    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", 
    { 
     tagmode: "any", 
     format: "json" 
    }, 
    function(data) { 
     var rnd = Math.floor(Math.random() * data.items.length); 

     var image_src = data.items[rnd]['media']['m'].replace("_m", "_b"); 
     $('.main').css('background-image', "url('" + image_src + "')"); 
    }); 
});

来源

2015-10-05 kerki

你想在一个设定的时间间隔加载不同的随机图像？

我认为这应该为你工作：

var loadNewImage = function() { 
    var rnd = Math.floor(Math.random() * data.items.length); 
    var image_src = data.items[rnd]['media']['m'].replace("_m", "_b"); 
    $('.main').css('background-image', "url('" + image_src + "')"); 
} 

setInterval(loadNewImage(), 3000);

这会设置一个新的背景图像，每3秒（3000毫秒），所以你可能要更改间隔时间，或将其与一个连接VAR在顶部，如果你愿意，你可以很容易地改变：

var imageInterval = 10000; 
setInterval(loadNewImage(), imageInterval);

来源

2015-10-05 14:24:45

是的，我想加载不同的随机图像 – kerki

使用'loadNewImage'代替'loadNewImage（）'作为第一个参数为'setInterval'。 'loadNewImage（）'执行该函数并使用它的返回值（在这种情况下未定义）作为'setInterval'的第一个参数，这是不正确的。 –

获取未捕获SyntaxError：意外的令牌var为该行var loadNewImage = function（） – kerki

我会使用setTimeout代替setInterval，在情况下，它花费的时间比[间隔]秒更长的时间来获取图像，由于网络延迟。

$(document).ready(function() { 
    var INTERVAL_IN_MS = 1000; // wait 1 second 

    function getImage() { 
    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", { 
     tagmode: "any", 
     format: "json" 
     }, function(data) { 
      var rnd = Math.floor(Math.random() * data.items.length); 
      var image_src = data.items[rnd]['media']['m'].replace("_m", "_b"); 
      $('.main').css('background-image', "url('" + image_src + "')"); 

     // start the timeout countdown only after the previous image has been fetched and displayed 
     window.setTimeout(getImage, INTERVAL_IN_MS); 
     }); 
    } 

    window.setTimeout(getImage, INTERVAL_IN_MS); 
});

来源

2015-10-05 14:31:43

在json调用上设置间隔以重新加载新图像

回答

相关问题