1

画像の URL の配列があり、これらをロードして、適切な寸法を取得し、必要に応じてそれらを処理/出力したいと考えています。

これを処理するための私のコードは次のとおりです（画像URLの配列をループします）：

for (var i = 0; i < data.IMAGES.length; i++) {

    var img = $("<img />").attr('src', data.IMAGES[i].url)
    .load(function() {

        if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {

            console.log("Error");

        } else {

            // This does output, but not correctly...

            if ( this.width > 299 ) {
                cache.$shareImages.append('<div class="share-image">' + img + '</div>');
            }

        }

    });
}

jQuery はコンテンツを追加するようですが、奇妙な方法で追加します。生成される出力の例を次に示します。

<div class="share-image">[object Object]</div>

動的に作成したimgタグそのものを出力したい。

なぜこれが起こっているのか、それを解決する方法は？

ありがとう、マイキー。

4

2 に答える 2

2

をチェーンし.append()、新しく作成された div に画像を追加してから、それをターゲットに追加する必要があります

$('<div class="share-image"></div>').append(this).appendTo(cache.$shareImages);

作業例: http://jsfiddle.net/blowsie/UCx73/

于 2013-05-20T12:05:32.910 に答える
2

あなたは文字列連結を行っています：

 '<div class="share-image">' + img + '</div>'

...だから、基本的にtoString()on img、 production を行い[object Object]ます。

おそらくあなたは試すことができます：

$('<div class="share-image"></div>').append(this).appendTo(cache.$shareImages);

EDIT：.load()ループが終了した後、ハンドラーは非同期で実行されることに注意してください。その時点で、img変数はループで最後に作成された img 要素に設定されます。そのため、load 内で、ロードしthisたばかりの特定の img を参照するために使用します。

于 2013-05-20T12:05:10.190 に答える