指定された画像を表示します。
画像が存在しないなどのエラーが発生した場合、アラートを出して画像を非表示にします。
Events/API/jQuery
error(fn)
各要素のerrorイベントに関数をbindします。
errorイベントは標準実装では存在しません。しかし多くのブラウザでは、JavaScriptがページ内で何らかのエラーを検知した際にこのイベントを発生させます。例えばimg要素でsrc属性に存在しない画像のパスや壊れた画像を指定した場合などに、errorイベントが発生します。
ブラウザのwindowオブジェクトからエラーが投げられた場合、イベントハンドラは関数に3つの引数を渡します。
コールバック関数がtrueを返す場合、それはエラーが関数内で処理された合図となり、ブラウザはエラーとして処理しません。
各ブラウザのエラー処理に関する更に詳細な動作については、以下を参照してください。
errorイベントは標準実装では存在しません。しかし多くのブラウザでは、JavaScriptがページ内で何らかのエラーを検知した際にこのイベントを発生させます。例えばimg要素でsrc属性に存在しない画像のパスや壊れた画像を指定した場合などに、errorイベントが発生します。
ブラウザのwindowオブジェクトからエラーが投げられた場合、イベントハンドラは関数に3つの引数を渡します。
- 発生したエラーを説明する文字列(“varName is not defined”、”missing operator in expression”など)
- エラーが発生したページのURL
- エラーを検出した行番号
コールバック関数がtrueを返す場合、それはエラーが関数内で処理された合図となり、ブラウザはエラーとして処理しません。
各ブラウザのエラー処理に関する更に詳細な動作については、以下を参照してください。
サンプル
サンプル1
<input type="text" size="100" value="http://static.jquery.com/files/design/images/logo_jquery3.png" /> <button id="show">Show Image</button> <div><img /></div>
$("#show").click(function(){
var imgSrc = $("input").val();
$("img").attr("src", imgSrc)
.show();
}).click();
$("img").error(function(){
$(this).hide();
alert("Not Found");
return true;
});
[全コードを表示]
[実行結果を単体で表示]