1. ホーム
  2. javascript

[解決済み] 壊れた画像を置き換えるjQuery/JavaScript

2022-03-17 18:51:04

質問

画像を大量に含むWebページがあります。時々、画像が利用できないことがあり、クライアントのブラウザに壊れた画像が表示されます。

jQueryを使って画像のセットを取得し、壊れた画像にフィルターをかけ、srcを置き換えるにはどうしたらよいでしょうか?


--jQueryを使えばもっと簡単にできると思ったのですが、純粋なJavaScriptのソリューション、つまりPrestaulが提供するものを使う方がずっと簡単だということがわかりました。

解決方法は?

を処理します。 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';" />

次の互換性表は、エラー機能をサポートしているブラウザの一覧です。

http://www.quirksmode.org/dom/events/error.html