Question

我一直试图让这个工作，并没有100％的成功，基本上尝试加载图像，如果源不存在尝试第二个图像，直到它达到默认图像。

我一直在尝试基于this question的解决方案，但是我没有使用jQuery，所以接受的解决方案对我没有用，所以尝试第二个解决方案，这几乎可行，但似乎没有是（如果这是有道理的？）。我可以让它来测试我们需要的第二个图像，但是它似乎没有再次触发onload事件。

function topTenImages(){
 var topTenDiv = document.getElementById('toptenimg');
 var topTenImg = new Image();
 var ac = "tryout";
 var imageOrder = new Array(
  "/images/codespec/banners/"+ac+"_topten.gif",
  "/images/codespec/banners/"+ac+"_topten.jpg",
  "/images/banners/default_topten.png",
  "/images/banners/default_topten.jpg"
 );
 var errorCnt = 0;
 topTenImg.src = domainResources+imageOrder[errorCnt];
 topTenImg.onLoad = new function(){
  if(!checkImage(topTenImg)){
   if(errorCnt &lt; imageOrder.length){
    var io = imageOrder[++errorCnt];
    topTenImg.src = domainResources+io;
   }
  }
 }
 topTenDiv.appendChild(topTenImg);
}

是的我知道我们可以使用php / perl / et al来做这个服务器端，但是我们试图限制我们的传出头，所以这似乎是最好的方法。（欢迎替代方案）。我的另一个想法是将它包装在数组的for循环中，并且每次都创建一个新对象。但这似乎更有意义。

谢谢， PSY

Answer 1

这应该回答你的问题： http://www.thefutureoftheweb.com/blog/image-onload-isnt-being-called 你只需要先设置onLoad。希望这会奏效：

 topTenImg.onLoad = function(){
  if(!checkImage(topTenImg)){
   if(errorCnt < imageOrder.length){
    var io = imageOrder[++errorCnt];
    topTenImg.src = domainResources+io;
   }
  }
 }
 topTenImg.src = domainResources+imageOrder[errorCnt];

Javascript检查图像源已加载

1 个答案: