javascript，image onload（）在webkit中不會觸發，如果加載相同的圖像

我有一個<img>元素，我正在更改它的src屬性。元素附有onload處理函數。每次我改變src屬性和圖像加載處理函數應該運行。javascript，image onload（）在webkit中不會觸發，如果加載相同的圖像

在Chrome和Safari中，如果我分配與之前相同的src，則不會運行處理函數。在分配與之前相同的src之前，我嘗試過imgElement.src=''，imgElement.src= null，imgElement.src='notExistingFile.jpg'，它們都不起作用。

請幫忙。任何人有過這個問題嗎？

編輯：它的工作象以前那樣通過分配相同的SRC之前做imgElement.src = ''：

imgElement.src = ''; 
imgElement.src = 'image.jpg';

來源

2011-02-17 bogdan

+1爲更簡單的imgElement.src =''解決方案。這會正確地卸載圖像，並允許onload（）再次觸發。 – ricosrealm 2012-03-20 07:40:21

這是一個known bug。以下是該鏈接的解決方法：

這不是一個錯誤。 WebKit只是更嚴格的。在更換之前，必須實例化一個新的 Image()對象，這樣的：
var photo = document.getElementById('image_id'); 
var img = new Image(); 
img.addEventListener('load', myFunction, false); 
img.src = 'http://newimgsource.jpg'; 
photo.src = img.src; 

來源

2011-02-17 01:28:48

謝謝...它的工作！ – bogdan 2011-02-17 01:52:44

傻我...它也通過做imgElement.src =''之前分配相同的src之前...我忽視了我有兩個地方，我不得不去那 – bogdan 2011-02-17 01:59:24

我覺得這裏的問題是，只是你要分配onload事件更改src值後，所以一旦圖像已經被加載到緩存中，瀏覽器在分配事件之前加載它。意味着不是這樣做：

myImageObject.src = "something.png"; 
myImageObject.onload = myCallback;

做到這一點：

myImageObject.onload = myCallback; 
myImageObject.src = "something.png";

來源

2011-02-17 01:41:14 Delta

在IE瀏覽器中有這個問題，事實上我分配src首先...做了你所說的並修復了它......謝謝！ – bogdan 2011-06-26 10:30:19

-1

要添加到馬特·鮑爾的回答，考慮img.onload代替img.addEventListener的（）。

var photo = document.getElementById('image_id'); 
var img = new Image(); 
img.onload = myFunction; 
img.src = 'http://newimgsource.jpg'; 
photo.src = img.src;

img.onload更易於閱讀，並可以在用戶代理中更好地工作。

來源

2014-05-24 18:52:21 gr1

javascript，image onload（）在webkit中不會觸發，如果加載相同的圖像

回答

相關問題