画像ファイルが見つからない場合に代替画像を表示

画像ファイルが見つからない場合に代替画像を表示

イメージタグに設定した画像ファイルが見つからない（存在しない）場合、【×】マークが表示されたりしてカッコ悪い。

そんな時、代わりの画像を表示させるコード。

<img src="本来の画像ファイル" onError="this.oneerror=null;this.src='代替画像ファイル';">

代替画像ファイルにファイルのパスを指定しておけば、万一本来の画像ファイルが見つからない場合に代替画像が表示されるスグレもの。

代替画像ファイルも見つからない場合は当然ですが【×】マークになります。

JavaScript
2019.07.06 07:07
2019.07.12 07:06

Related entry

2022.03.02 JavaScriptで非推奨になった「document.write()」の代替方法と、scriptからscriptを読み出す方法 2021.04.24 JavaScriptでPOSTリダイレクト（redirect ）する方法 2021.03.14 iframeの高さを取得してheight:100%に自動調整するJSコード 2019.07.06 複数のアイテムを重複せずにランダム表示する方法 2019.07.06 HTMLの静的ファイルにパラメータ（引数）を受け渡す最短スクリプトコード 2019.07.06 jqueryで親要素の幅を取得（padding含めずに） 2019.07.06 テキストエリアのカーソル位置にボタンクリックで指定文字を挿入 2019.07.06 セレクトメニュー（select）でリンク

Pickup entry

2019.07.06 freoをPHP7.xで利用するために…。 2021.04.10 PHPのバックグラウンドでPOST送信～実行結果を挿入するコード 2021.01.15 Mircrosoft Edge を InPrivate ブラウズモードで起動する方法 2024.02.17 OpenAI Soraとは？テキストから動画を生成する画期的AIモデル 2019.07.06 Youtube（iframe）の埋め込みコードをレスポンシブ対応で掲載する 2019.07.06 横幅いっぱい（ピッタリ）に要素を並べるCSS（もちろんレスポンシブで…） 2019.07.06 SeesaaブログにYouTube関連動画を自動表示する方法 2020.11.22 freoのエントリーに登録日時と更新日時を表示する方法