使用Javascript检测图像加载取消

Question

我当前正在使用setTimeout和onLoad依次加载多个图像的页面上工作。 基本上，当图像完成加载时，会触发onLoad ，它会通过setTimeout调用开始另一个图像加载。 不幸的是，如果由于某种原因（例如随后的ajax调用）而中断了图像加载，则永远不会调用onload，也不会加载任何要加载的图像。 javascript中有什么方法可以检测到这种情况？ 我试图挂接到onError和onAbort （在图像标签上），但似乎都没有被调用。

  queuePhotos: function(options)
{
  this.init();
  this.photo_urls = options.photo_urls;
  this.photo_size = options.size
  this.max_width = options['max_width'];
  this.max_height = options['max_height'];
  this.containers = options['containers'];
  yd = YAHOO.util.Dom;
  photo_tags = yd.getElementsByClassName('image_stub', 'div');
  for( i in photo_tags )
  {
    //create new image
    photo = new Image();
    this.queue.push( { tag: photo_tags[i], photo: photo } ); 
  }
  setTimeout(photoLoader.prepareNextPhoto, 1);
},

prepareNextPhoto: function()
{
  photo_tag_and_image = photoLoader.queue.shift();
  if(photo_tag_and_image)
  {
    YAHOO.util.Event.addListener(photo_tag_and_image.photo, "load", photoLoader.appendPhoto, photo_tag_and_image, photoLoader);
    photo_tag_and_image.photo.src = photoLoader.photo_urls[photo_tag_and_image.tag.id];
  }
},

Answer 1

AJAX调用不应取消图像的加载。 这里可能还有其他事情发生...

我认为您无法轻易检测到图像的加载失败。 如果超时计时器在从映像获取加载事件之前过期，则可以触发具有特定超时阈值的计时器以将映像视为失败。

Answer 2

您可以调用onload和onerror

myImage.onload = function(){ alert("loaded"); };
myImage.onerror = function(){ alert("whoops"); };

埃里克