- ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:jQueryでのerrorイベントについて)
jQueryでのerrorイベントについて
このQ&Aのポイント
- jQueryでimgタグのsrc属性に記述された画像ファイルが存在しない場合に、代替えの画像を表示するスクリプトを実現したいが、状態が不安定である。
- imgタグのクラスを指定しているが、画像が存在しない場合にはクラスが適用されず、代替えの画像が表示されないことがある。
- 現象の原因は不明であるが、ブラウザのバージョンによって動作が異なる可能性がある。
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
>> No.1 補足 「srcの再設定」ですが、難しく考えず「srcプロパティに値(同値でも)を設定すれば、その画像を読み込む」でいいと思います。 「.error()の実行」 -> 「srcの再設定」 イベントを監視できるようにしてから画像を読み込みますから、確実にイベントを拾えます。
その他の回答 (1)
- my--
- ベストアンサー率89% (91/102)
回答No.1
$(function() {...});の引数実行はHTMLの解析(DOM)が終わってからですが、画像の読み込み自体は別プロセス(非同期)で行われています。.error()の実行前にerrorイベントが発火しているのが不安定の要因ではないかと。 $(function() { $("img.nophoto").each(function () { var obj = $(this); obj.error(function () { obj.attr("src", "no_photo.jpg"); }); obj.attr("src", this.src); // srcの再設定 }); }); loadイベントでもそうですが、srcの再設定を行うようにすれば良いです。
質問者
補足
回答ありがとうございました。素晴らしい回答者様に出会えまして感激です。結論から言いますと、ご提示頂きましたコードで実現できました。ありがとうございます。現象が発生した理由も分かりました。ただ、コードを見てもなぜ、これでそれが解決できるのかが良く分かりません。srcの再設定についてもう少しご教授願います。もしくは参考になるサイトなどあれば教えて頂けると助かります。(同じような質問が多数見つかりますがズバリ解決していたり、解説しているサイトは見つかりませんでした。)
お礼
ありがとうございました!簡潔な説明ありがとうございます。良く分かりました!