如何用新圖像替換onerror src圖像

Question

由於某種原因，我的photo.onerror圖像沒有加載，因為我在這些圖像之間切換並遇到一個沒有一組圖像的問題，onerror圖像仍然無法加載，這有什么不對嗎？

  if (document.getElementById("draft_player_photo")) {
     var photo = document.getElementById("draft_player_photo");
     photo.src = "http://www.myfantasyleague.com/player_photos_2013/" + pid + "_thumb.jpg";
     photo.alt = playerDatabase['pid_' + pid].name;
     photo.title = playerDatabase['pid_' + pid].name;
     photo.onerror = "this.onerror=null;this.src='http://www.myfantasyleague.com/player_photos_2010/no_photo_available.jpg';";
  }

Answer 1

您需要將photo.onerror定義為一個函數，因為現在您只需將一個字符串分配給onerror ：

..
photo.onerror = function() {
    this.src=this.getAttribute('fallback') //reuse of my original idea, but whatever works
}   
...

演示-> http://jsfiddle.net/zpLm0e7d/

---

我將實現一個后備src ：

<img id="draft_player_photo" fallback="http://www.w3schools.com/images/colorpicker.gif"src="http://www.myfantasyleague.com/player_photos_2013/11657_thumb.jpg" alt="this image">

然后捕獲任何onerror並將src設置為該后備值：

$('img').on('error', function() {
  $(this).attr('src', $(this).attr('fallback'))
});   

演示-> http://jsfiddle.net/4p8gdppL/

抱歉w3fools參考，他們有短長度的圖像。