jQuery API の error( fn ) は、エラーイベントにイベントハンドラをバインドしたいときに便利なメソッドだ。
エラーイベントが発生したときに、error( fn ) の引数に指定したイベントハンドラを呼び出すことができる。
「jQuery Version 1.8」の時点で非推奨になった。
記述方法
jQuery( セレクター ) . error( イベンドハンドラ );
「セレクター」の要素のエラーイベントに、「イベンドハンドラ」をバインド。
実装例（サンプル）
実装例（サンプル）の動作について
「サンプル画像３.jpg」を選択すると、画像が表示されず、「サンプル画像３.jpg の読み込みに失敗しました。」と表示する。
実装例（サンプル）のソースコード
JavaScript
<script>
<!--
jQuery( function() {
jQuery( '#jquery-api-change-select' ) . change( function () {
var strValue = jQuery( '#jquery-api-change-select option:selected' ) . attr( 'value' );
jQuery( '#jquery-api-error-sample-img' ) . attr( 'src', strValue ) . show();
var strText = '';
jQuery( '#jquery-api-error' ) . text( strText );
} )
. change();
jQuery( '#jquery-api-error-sample-img' ) . error( function() {
jQuery( this ) . hide();
var strText = jQuery( '#jquery-api-change-select option:selected' ) . text() + ' の読み込みに失敗しました。';
jQuery( '#jquery-api-error' ) . text( strText );
return true;
} );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery( '#jquery-api-change-select' ) . change( function () {
var strValue = jQuery( '#jquery-api-change-select option:selected' ) . attr( 'value' );
jQuery( '#jquery-api-error-sample-img' ) . attr( 'src', strValue ) . show();
var strText = '';
jQuery( '#jquery-api-error' ) . text( strText );
} )
. change();
jQuery( '#jquery-api-error-sample-img' ) . error( function() {
jQuery( this ) . hide();
var strText = jQuery( '#jquery-api-change-select option:selected' ) . text() + ' の読み込みに失敗しました。';
jQuery( '#jquery-api-error' ) . text( strText );
return true;
} );
} );
// -->
</script>
CSS
<style type="text/css">
<!--
#jquery-api-change-select {
margin: 10px;
}
-->
</style>
<!--
#jquery-api-change-select {
margin: 10px;
}
-->
</style>
HTML
<p>
<select id="jquery-api-change-select" name="imgSample">
<option value="img/sample1.jpg">サンプル画像１.jpg</option>
<option value="img/sample2.jpg">サンプル画像２.jpg</option>
<option value="#">サンプル画像３.jpg</option>
</select>
</p>
<p>
<img id="jquery-api-error-sample-img" />
<span id="jquery-api-error"></span>
</p>
<select id="jquery-api-change-select" name="imgSample">
<option value="img/sample1.jpg">サンプル画像１.jpg</option>
<option value="img/sample2.jpg">サンプル画像２.jpg</option>
<option value="#">サンプル画像３.jpg</option>
</select>
</p>
<p>
<img id="jquery-api-error-sample-img" />
<span id="jquery-api-error"></span>
</p>