Как обновить источник изображения, только если новое изображение действительно доступно?

Question

<!--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> 

Я использую приведенный выше код, чтобы обновить метеорологический радар .gif изображение на моем веб-сайте каждые 15 минут. Это нормально работает отлично, но иногда, когда происходит обновление, изображение прерывается от источника, а на моем сайте есть сломанный значок изображения, пока не произойдет следующее обновление. 15 минут спустя. Я хотел бы настроить это так, чтобы, если запрошенное изображение было сломанным или недоступным в момент запуска функции обновления, я сохраняю изображение, которое уже загружено, вместо того, чтобы заменить его сломанным изображением. Я готов использовать любой javascript или JQuery, который мог бы это сделать, но я начинающий программист, поэтому, если вы можете сломать любой сложный код, который будет высоко оценен. Благодаря!

Answer 1

Вы можете попробовать что-то вроде этого

<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> 

он пытается загрузить источник временного изображения и только после успешного источника загрузки assings к «content14»