Question

我试图了解JQuery Deferred对象。我正在研究一个JS框架，它加载一个模板和一些JSON对象并使用它们生成一些HTML。最初的方法是按顺序加载它们（伪代码）：

load_template(template_url, function (template_data) {
    load_json(json_url, function (json_data) {
       render(template_data, json_data);
    });
});

这是次优的，因为json只在加载模板后才开始加载。我将其修改为使用延迟对象：

$.when(load_template, load_json).done(function (template_xhr, json_xhr) {
    render(template_xhr[0], json_xhr[0]);
});

到目前为止一切顺利。现在我已经共同打电话给＃34; partials＆＃34;这是一些内联的HTML片段，它们是从一个单独的模板和JSON数据构建的，这些数据是异步请求然后插入到页面中的。目前我在渲染主模板后开始加载它们：

load_template(template_url, function (template_data) {
    load_json(json_url, function (json_data) {
       render(template_data, json_data);
       $.each(partials, function (idx, partial_url) {
           load_partial(partial_url, function (partial_data) {
               $("#some-element-id").html(partial_data);
           });
       }); 
    });
});

这又是次优的，因为我可以在主模板之后立即开始加载它们。

然而，问题是部分可以在加载和渲染主模板之前完成加载，因此无法插入它们。或者他们可以稍后完成。

将它们粘贴到单个$ .when（）调用中并不好，因为我想在主模板和JSON数据准备好后立即显示页面，因此以下操作无效：

$.when(load_template, load_json, load_partial_template, load_partial_json, ...).done(function (template_xhr, json_xhr, ...) {
    render(template_xhr[0], json_xhr[0]);
    insert_partial(...);
});

所以，问题是：

是否可以使用Deferred对象设置一系列ajax请求，以便将它们分成几组：

所有请求都是同时启动的
来自＆＃34;第1组＆＃34;的请求完成后调用回调函数

Answer 1

你能为你的局部设置一个Deferreds集合，还有一个主Deferred，然后只在主Deferred完成后用部分结果做一些事情？

var dfdPartials = [];
$.each(partials, function (idx, partial_url) {
    dfdPartials.push($.when(createDeferredForPartial(partial_url));
});

var dfdTemplate = $.when(load_template, load_json).done(function (template_xhr, json_xhr) {
    render(template_xhr[0], json_xhr[0]);
    $.each(dfdPartials, function (idx, dfd) {
        dfd.done(function (partial_data) {
            $("#some-element-id").html(partial_data);
        });
    });
});

JQuery Deferred对象和ajax调用

1 个答案: