5

画像に.error（）を使用して画像が存在するかどうかを判断し、存在しない場合はプレースホルダーを追加することに関して、スタックにいくつかの解決策がありますが、それらはすべて、<img>タグでの使用について厳密に説明しています。<img>タグに追加されていない画像に対して、divの背景としてこのタイプの検証を実行した人はいますか？

サードパーティのAPIからの画像のセットがあり、返される画像のURLのセット全体が存在しない場合があります。一連の画像（背景画像を対象とする）を検証して、それらが存在するかどうかを判断し、検証が失敗した場合に適切なプレースホルダーを適用するための適切な方法は何でしょうか？

4

2 に答える 2

25

これを行うには、いくつかの方法があります。

ajaxの使用：

$.ajax({
    url: "image.jpg",
    type: "HEAD",
    error: function () { alert("no image"); }
});

javascriptイメージオブジェクトの使用：

var image = new Image(); 
image.src = "image.jpg";
if (image.width == 0) {
  alert("no image");
}
于 2013-02-07T15:55:04.203 に答える
1

jqueryの使用：$("<img src='[path]'>").load(function(){ [image exists!] });を含むすべての要素に対してbackground-image。

私たちが実装したソリューションは、サードパーティのAPI側に特定の画像が存在するかどうかを確認する中間のサーバー側スクリプトを作成することです。存在する場合は画像を提供し、存在しない場合はプレースホルダーを提供します。このようにして、画像は常に提供され、画像のキャッシュ/サイズ変更の機能が追加されます。

別の解決策は、画像が存在するかどうかを実際にチェックしないことです。プレースホルダー画像にCSSを提供でき、JavaScriptを介して背景画像を追加する場合は、存在する場合は既存のルールを上書きします。

于 2013-02-07T16:14:40.877 に答える