javascript - jQuery .lastLoad 的几个事件

Question

我正在将远程内容加载到多个 div 中，并希望测量它们并在所有内容加载后比较结果。获得此事件的最佳方式是什么？

伪代码:

$("#div1").load("www.foo.com/1");
$("#div2").load("www.foo.com/2");
$("#div3").load("www.foo.com/3");

function div1_and_div2_loaded(){
    alert("Success!");
}

Answer 1

您可以使用 $.when() 在一组 AJAX 请求完成时执行代码。不过，您需要修改代码以使用 $.ajax，因为 load 不会返回延迟对象。试试这个:

var request1 = $.ajax({
    url: 'http://www.foo.com/1',
    success: function(response) {
        $('#div1').html(response);
    }
})

var request2 = $.ajax({
    url: 'http://www.foo.com/2',
    success: function(response) {
        $('#div2').html(response);
    }
})

$.when(request1, request2).done(function() {
    alert('success!');
});

此模式的优点是所有*请求将同时执行，从而加快整体加载时间。

*如果您发出大量请求，浏览器可能会对请求进行排队。

显然，您需要干燥请求的创建，这只是一个快速而肮脏的示例。