画像の読み込みに失敗したら
IE8以下のみで失敗する場合
IE8以下は、すでにブラウザがキャッシュをしている場合、onloadメソッドが走りません。(最新のブラウザではキャッシュをしていても走ります)
var img = new Image(); img.src = hoge.jpg'; img.onload = function(){ //IE8以下ではキャッシュしているとここに到達しません }
そんなときは、以前iframeに関する記事でも書きましたが、重複しない値をパスに付加しましょう。
UNIX時間なら間違いなく重複しません。 以下はDateオブジェクトのgetTimeメソッドで、現在のUNIX時間を取得しています。
var img = new Image(); img.src = hoge.jpg' + "?" + new Date().getTime(); img.onload = function(){ //パラメータを追加すればここに到達します }
画像自体が存在しない場合
これは全ブラウザに共通しています。
存在しない画像のパスを指定してしまったら、もちろんロードはできません。
もし万が一、画像の場所が移動してしまったとき、onloadメソッドは走りません。
プリロードなど、次々にImageオブジェクトを作らなければいけないときは、画像のパスが存在しなかった時点で止まってしまいます。
そんなときはonerrorで保険をかけます。
var img = new Image(); img.src = hogehoge.jpg' + "?" + new Date().getTime(); img.onload = function(){ //本来の処理 } img.onerror = function(){ //保険の処理 }