[JavaScript] 画像が読込み中かどうかチェックする

投稿日：2018年8月1日

画像が読込み中かどうかチェックするサンプルです。

サンプルソース

例）画像が読込み中かどうかチェックする

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>サンプル</title>
<script>
function fncCheckImg(){
  var x = document.getElementById("img1");
  if(x.complete){
    alert("読込み完了です。");
  }else{
    alert("読込みは完了していません。");
  }
}
</script>
</head>
<body>
  <img src="bb.png" id="img1">
  <input type="button" value="チェック" onclick="fncCheckImg();">
</body>
</html>

<!DOCTYPE html>

<head>

function fncCheckImg(){

var x = document.getElementById("img1");

if(x.complete){

alert("読込み完了です。");

}else{

alert("読込みは完了していません。");

}

</script>

</head>

<body>

</body>

</html>

チェックボタンを押すと、画像の読込状況を表示します。

解説

読み込み処理が終わっていれば、リンク切れで読み込めない場合でもtrueとなります。

執筆者：とら