web-dev-qa-db-ja.com

javascriptはimgsrcが有効かどうかをチェックしますか?

私は次のようなものを持っています:

document.getElementById('MyPicture').src = 'attempted.png';

クライアントがそのリソースを取得できない場合は、次のように置き換えます。

document.getElementById('MyPicture').src = 'error.png'

画像タグにonError = function()を入れることができることは知っていますが、IDをonErrorに渡して、悪い写真のsrcを変更できるonError関数を1つ持つにはどうすればよいですか?

13
kiasecto

はい、onerrorイベントを使用できます。たとえば、画像要素は実際に 広くサポートされています

var image = document.getElementById('MyPicture');
image.onerror = function () {
  alert('error loading ' + this.src);
  this.src = 'error.png'; // place your error.png image instead
};

image.src = 'non-existing.jpg';

例を確認してください ここ

16
CMS

これを画像タグに入れます:

onError="image_error(this.id)"

これは、画像のIDをimage_error関数に渡します。

2
kiasecto

OnError属性を追加することは、確かにそれを処理する正しい方法です。あなたの場合、次のようなものを追加します。

var myPicture = document.getElementById('MyPicture');
myPicture.onError = errorHandler();

function errorHandler(msg,file_loc,line_num) {
  myPicture.src = 'http://www.google.com/intl/en_ALL/images/srpr/logo1w.png';
}
1
Raul Agrait