3

AJAXでHTMLドキュメントをロードしたいのですが、このドキュメントのすべての画像がロードされたときに表示したいと思います。

$('.about').click(function () {
    $(".back").load('Tour.html', function () {
        $(".back").show();
    });
});

「.back」は、Tour.htmlのすべての画像が読み込まれたときに表示され、成功イベントがトリガーされたときに表示されますか?

4

3 に答える 3

5
$(".back").load('Tour.html', function (html) {
    var $imgs = $(html).find('img');
    var len = $imgs.length, loaded = 0;
    $imgs.one('load', function() {
        loaded++;
        if (loaded == len) {
            $(".back").show();
        }
    })
    .each(function () { if (this.complete) { $(this).trigger('load'); });
});

<img>これには、返されるhtmlに少なくとも1つ必要です。

于 2013-02-12T20:03:41.677 に答える
1

私が提案するのは、代わりにiframeを使用することです。プレーンJavaScriptのサンプルコードを次に示します。

var ifr=document.createElement("iframe");
ifr.style.display="none";
document.body.appendChild(ifr);
ifr.onload=function() {
    // Do what you want with Tour.html loaded in the iframe
};
ifr.src="Tour.html";
于 2013-02-12T20:52:12.867 に答える
0

ImagesLoadedはあなたが探しているものです。

指定された画像が読み込まれるときに、すべてのコード(この場合はajaxリクエスト)を配置します。

load()プラグインは、キャッシュされた画像で使用できない理由を指定します

于 2013-02-12T20:03:12.493 に答える