使用ONLY替換破碎的圖像

這似乎是一個問了上千次的問題......但我已經花了兩天時間，還沒有完成。使用ONLY替換破碎的圖像

我見過像this這樣的答案，尤其是第一個。但是，當我嘗試使用只有JavaScript的時候，程序從不等待。即使我把迴歸在

if(image.complete) {return path;}

它寧可退出等待圖像加載。

這是我的代碼。我想在純粹的Javascript，因爲函數的返回是一個SVG的attribut的價值：在d3.js

.attr("xlink:href", function (d) { 
      var imagePath = "http://xxxxx/peopleimages/" + d.num + ".jpg"; 
      var img = new Image(); 
      function onErrorHandler(image) { 
       image.onerror = ""; 
       image.src = genericPath; 
       return false; 
      } 
      img.onerror = onErrorHandler(this); 
      img.src = imagePath; 

      return img.src;

提前感謝形象！

來源

2012-09-27 wceo

的代碼應該是更多這樣的：

function onErrorHandler() { 
    $(this).off('error', onErrorHandler); 
    this.src = genericPath; 
    return false; 
} 
$(img).on('error', onErrorHandler); 
img.src = imagePath; 

return img.src;

來源

2012-09-27 16:04:59 bfavaretto

不好意思，但我完全不熟悉javascript，控制檯說HTMLImageElement沒有方法'on' – wceo

對不起，我的錯。固定。 – bfavaretto

對不起，但返回仍然不會等待onErrorHandler =（ – wceo

我不知道你需要什麼，但我通常使用的onload和onerror的，我沒有問題。有些人喜歡說：

function loadImg(targetId,imgURL){ 
    var contenedorImgs = document.getElementById("container"); 
    target = document.getElementById(targetId); 
    var img = new Image(); 
    img.onload = function(){ 
     contenedorImgs.replaceChild(img,target); 
     img.id = targetId; 
    }; 
    img.onerror = function(){ 
     img.src = "http://marcocavalieri.es/fotos/miniaturas/1B.jpg"; 
    }; 
    img.src = "http://dev.marcocavalieri.es/fotos/" + imgURL; 
}

此代碼是一個真正的代碼我女兒的摘錄，我開發馬爾科卡瓦列裏，你可以在http://dev.marcocavalieri.es看到，在這種情況下，因爲我需要一些淡入和fadeouts我預先載入圖像。您可以在小提琴中看到生動的摘錄示例：http://fiddle.jshell.net/hmariod/kCRHV/1/

Bonneannéeet bonnesanté！

來源

2013-01-01 18:19:01 HMarioD

使用ONLY替換破碎的圖像

回答

相關問題