Question

我正在加载另一个HTML页面的AJAX请求，然后将其插入到当前页面的DOM元素中。

我通过AJAX获得的页面包括link对样式表的引用，以及必须从服务器加载的多个图像。

我希望在AJAX调用的所有资源加载后执行代码，包括引用的样式表和图像。
请注意，这些样式表和图像不是直接从AJAX加载的，而是由于从AJAX调用中插入HTML而加载的。

因此，我不是在寻找success:回调，而是在AJAX调用之后寻找另一个$(window).load(function () { ... });（我已经尝试再次收听$(window).load但没有成功。

如果您需要更多代码，请与我们联系。

Answer 1

检查是否已加载样式表很困难 - 尤其是跨浏览器。 This article建议在加载的样式表中使用已知规则更改元素，并轮询以检查其样式是否已更改为检测加载。

图像更容易，我希望它们需要花费更长时间才能加载，因此您可能只需检查图像加载即可。

success: function (html) {
    var imageloads = [];
    $(html).find("img").each(function () {
        var dfd = $.Deferred();
        $(this).on('load', function () {
            dfd.resolve();
        });
        //Image was cached?
        if (this.complete) {
            $(this).trigger('load');
        }
        imageloads.push(dfd);
    });
    $.when.apply(undefined, imageloads).done(function () {
        //images finished loading
    });
}

在ajax请求之后再次收听`$（window）.load`

1 个答案: