在ajax请求之后再次收听`$(window).load`

Question

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

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

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

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

如果您需要更多代码,请与我们联系.

Answer 1

检查是否已加载样式表很难做 - 尤其是跨浏览器. 本文建议在加载的样式表中使用已知规则更改的元素,并轮询以检查其样式是否已更改为检测加载.

图像更容易,我希望它们需要更长的时间来加载,所以你可能只能检查图像加载.

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
    });
}