知っていて損はない!?画像が読み込めなかったら別の画像を表示するjavascript!

 
今回はそんなこと使うときある??みたいなものを紹介します。
とはいえ一定の需要はあると思います。

通常は画像が読み込めない場合は、これまたあまり実際にはお目にかかれないaltの文字列が表示されますね。

こんな時に文字列じゃなくてちゃんと「No image」とかの画像にしたいよ!ってパターンはあるんじゃないかと思います。

実際に僕はありました!!
なのでご紹介します。

プログラミングやWordPressを習得するのに一番近道な方法とは?

javascriptのonErrorイベントを使っちゃう!

 
早速サンプルコードを書いちゃいますね。

hoge1.pngが読み込めなかった場合にhoge2.pngが表示されます。

onErrorはエラーが起こった際のイベントなので、下記みたいにアラートを入れ込んだりももちろんできますよ。


 
誰かの役に立つのなら嬉しいです!

もし良かったらフォローとか購読して頂けると嬉しいです!╭( ・ㅂ・)و ̑̑ グッ !

follow us in feedly

コメントを送る

メールアドレスが公開されることはありません。

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください