javascript - <img>标签的currentSrc更改时是否触发Javascript事件？

假设我有一个<img>标记:

<img id="my_tag" src="/default.jpg" srcset="/small.jpg 500w, /medium.jpg 1000w, /large.jpg 2000w">

当我加载页面时，JavaScript可以告诉我它使用的是哪种srcset:

document.getElementById("my_tag").currentSrc

如何检测currentSrc何时更改并触发事件？

避免“重复!”的呼声我可以使用DOM MutationObserver code here，jQuery observe或onload事件来确认它不会在Chrome中触发:

var my_tag = document.getElementById("my_tag");
my_tag.onload = function(){
    alert("CHANGED");
    console.log( "Src changed to " + my_tag.currentSrc );
};

我认为这是因为当使用srcset时，当currentSrc更改时，它似乎并未更新DOM。

最佳答案

您可以使用图片的“onload”事件:

var my_tag = document.getElementById("my_tag");
my_tag.onload = function(){
    console.log( "Src changed to " + my_tag.currentSrc );
}

Cross-browser image onload event handling上的相关文章