[jQuery]画像の404を検知

画像が存在するかどうか(404かどうか)を確認する方法って？

まずは、こちらから

I'm looking for a way to detect that a certain image failed to load correctly (404) in a cross browser way. If that happens, we want to use JS to show a spinner in it's place and reload the image every few seconds until it can be successfully loaded from s3.

via:Detecting a image 404 in javascript

それに対する答えとして、Detecting Broken Images in JavaScriptが紹介されていましたが、これは、native JSの場合。

では、jQueryではどうすればいいのか？

$(function(){ var jImgObj = $('<img>'); jImgObj.attr('src','hoge.gif'); jImgObj.bind('error',function(){ console.log('not loaded'); }); jImgObj.bind('load',function(){ console.log('loaded'); }); });

IE7、IE8、chromeで正常動作