0

画像が存在しないために.error（）が発生するまで、画像を追加してカウントをインクリメントする単純なwhileループである必要があります。

問題は、エラーイベントが発生しないことです。ディレクトリには3つの画像がありますが、タブがクラッシュするまでページが無期限に読み込まれます。HTML内の画像で.error（）を呼び出すと機能します。これは、画像を追加してからerrorを呼び出す場合のみです。

以下のコード：

jQuery(document).ready(function($) {
    var images = 'load';
    var i = 1;

    while(images == 'load') {
        $('.images').append('<img src="window_0' + i + '.jpg" />')
            .error(function() {
                images = 'finished';
            });
        i++;
    }

});

while（i <4）を使用すると、.error（）の結果は関係ないため、完全に機能します。コードを編集せずにディレクトリにファイルを追加するだけでロードされる画像の数を増やすことができるように、これを可変にする必要があります。

これは以前はajax呼び出しで可能でしたが、私のバージョンのjQuery（1.7.1）では機能しません。

4

1 に答える 1

1

ここには 2 つの主な問題があります。まず、エラー イベントをここで img にバインドしていません。$('.images') にバインドしています。

次に、javascript は (ほとんどの場合) シングルスレッドです。画像の読み込みはバックグラウンドで発生する可能性がありますが、ループが終了するまで JavaScript イベント処理は発生しません。これは、イベントが発生しない限り実行されないため、catch-22 が発生します。

これは、エラー イベントを待つのではなく、ロード イベントをチェーンすることで同様のことを行います。

    var i = 1;
    var img;
    function next() {
        if (img) $('.images').append(img);
        img = document.createElement('img');
        $(img).load(next);
        img.src='window_0' + (i++) + '.jpg';
    }
    next();
于 2012-11-04T21:39:56.760 に答える