如果新图像实际可用,如何刷新图像源?

时间:2013-12-05 19:38:35

标签: javascript jquery image src

<!--WunderGroundRadar--> 
<script type = "text/javascript">
   setInterval(function refreshRadar() {

   document.getElementById("content14").src =  "http://api.wunderground.com/api/MyAPIkey/animatedradar/q/autoip.gif?&radius=90&num=15&delay=20&width=430&height=500&smooth=1&newmaps=1&interval=15&rainsnow=1" 
  }, 900000);

</script>

我使用上面的代码每隔15分钟刷新一次我的网站上的天气雷达.gif图像。这通常很有效,但有时当刷新发生时,图像会从图像中断,并且我的网站会有一个损坏的图像图标,直到下一次刷新发生。 15分钟后。我想设置它,以便如果请求的图像在刷新功能运行时被破坏或不可用,我保留已加载的图像而不是用损坏的图像图标替换它。我愿意使用任何可能实现此目的的javascript或Jquery,但我是一个新手程序员,所以如果你可以分解任何复杂的代码,将非常感激。谢谢!

1 个答案:

答案 0 :(得分:2)

您可以尝试这样的事情

<script type = "text/javascript">
   setInterval(function refreshRadar() {

      img = new Image();

      img.onload = function(){
         document.getElementById("content14").src = img.src;
      };

      img.src = "http://api.wunderground.com/api/MyAPIkey/animatedradar/q/autoip.gif?&radius=90&num=15&delay=20&width=430&height=500&smooth=1&newmaps=1&interval=15&rainsnow=1" 

  }, 900000);

</script>

它尝试将源加载到临时图像,并且仅在成功加载源时将源加载到&#34; content14&#34;