angularJS_javascript_exist_image

[AngularJS] [JavaScript] 画像ファイルが存在するかチェック

// 指定のURLの画像が存在するか調べる.
var ret = false;
function existImage(imageURL) {
  var img = new Image();
  img.src = imageURL;

  img.onload = function() {
    // 読み込み成功.
    ret = true;
  }
  img.onerror  = function() {
    // 読み込み失敗.
    ret = false;
  }
}

上記では「img.src = imageURL」の直後にimg.heightを見た場合は、まだ読み込まれていないことが多く、img.heightが0のままになります。

読み込みが成功したかどうかは、onload/onerror として別途返されます。img.onload関数が呼ばれた場合は読み込み成功、img.onerror関数が呼ばれた場合は読み込み失敗。

結果が返されるまで待たせる処理を入れるのはあまりよろしくないので、非同期にて対処できる実装を心がけたほうがよさげです。

最終更新時間：2014年05月31日 21時56分26秒