たくさんの画像を含む Web ページがあります。画像が利用できない場合があり、クライアントのブラウザーに壊れた画像が表示されます。
jQuery を使用して画像のセットを取得し、壊れた画像をフィルタリングして src を置き換えるにはどうすればよいでしょうか?
--jQuery を使用すると簡単にできると思っていましたが、純粋な JavaScript ソリューション、つまり Prestaul が提供するソリューションを使用する方がはるかに簡単であることがわかりました。
ベストアンサー1
onError
JavaScript を使用して画像のソースを再割り当てするイベントを処理します。
function imgError(image) {
image.onerror = "";
image.src = "/images/noimage.gif";
return true;
}
<img src="image.png" onerror="imgError(this);"/>
または、JavaScript 関数なしでも:
<img src="image.png" onError="this.onerror=null;this.src='/images/noimage.gif';" />
次の互換性表には、エラー機能をサポートするブラウザがリストされています。