為什么在.on（）工作時調用.error（）？ （IE11）

Question

$(function() {  /*jquery .ready()*/
  var thumb_img = new Image();
  thumb_img.id = 'cid_' + 1730;
  thumb_img.src = ""; 

  $(thumb_img).on('load', function() {
    console.log("Image loaded " + thumb_img.src);
  }).error(function(){
    console.log("ERROR loading image " + thumb_img.src);
  });

  thumb_img.src = 'https://fiddle.jshell.net/img/logo.png';
});

結果在控制台中：

Image loaded https://fiddle.jshell.net/img/logo.png
ERROR loading image https://fiddle.jshell.net/img/logo.png

如果圖像無法加載，我只希望調用.error（）。 這似乎僅在IE（使用11）中發生。

使用jQuery 2.0.2

Answer 1

錯誤與此行有關：

thumb_img.src = ""; 

從您的代碼中刪除上一行。 對於IE11，似乎更改了source屬性，因此出現了錯誤。

 var thumb_img = new Image(); thumb_img.id = 'cid_' + 1730; //thumb_img.src = ""; $(thumb_img).on('load', function() { console.log("Image loaded " + thumb_img.src); }).on('error', function(e){ alert("ERROR loading image " + thumb_img.src); }); thumb_img.src ='https://fiddle.jshell.net/img/logo.png'; document.body.appendChild(thumb_img); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> 

Answer 2

嘗試改用load()方法。 這樣，您可以在回調中查找錯誤。 只要更改圖片的src屬性，就應該觸發此操作。 從技術上來講，您馬上就在執行操作，因此會出現錯誤。

$('img').load(function(response, status, xhr){
    console.log('loaded');
    console.log({response,status, xhr});
    if (status === "error") {
        console.log('error here');
    }
});

$('img').attr('src', 'someimageurl');