画像ファイルの可視性の確認

Question

最近、ajaxとphpを使用してサーバーへの画像ファイルのアップロードを処理するページを作成するように求められました。キャッチは、ファイルが選択されたときで、ページ上でプレビューする必要があります。

問題は私の目が破壊されているため、画像が表示されているかどうかを確認できません。

$("#img").attr('src'); 

私の質問をされています：要素に一定の長さと高さを考えると、私はsrc属性を持っている限り、ことは確かだろう解決するために、私はこのように、値のsrc属性をチェックすることになりました有効な画像ファイルが表示されますか？すべての場合に有効でしょうか？そうでない場合は、画像が存在し、表示されているかどうかを確認する最良の方法は何ですか？

Answer 1

画像の読み込み状態と空き状況を確認するには、loadとerrorイベントリスナーを使用できます。

$("#img").on("load", function() { 
    // the image is successfully loaded 
}).on("error", function() { 
    // the image could not be loaded, maybe the image is not availbale 
});