如何使用jquery延迟与vktemplate /排队ajax请求

时间:2012-11-19 21:21:04

标签: javascript jquery jquery-templates jquery-deferred

当我尝试使用jquery延迟时,使用vktemplate并不是很有用。由于vktemplate对其自己进行了ajax调用,因此在vktemplate完成其工作之前,deferred会被解析,并且它的可选回调也会被解析。我怎样才能设置vk,以便在这两件事发生之后才能解决承诺?

$(document).on('click', '.ajax', function() {
    $.when(ajax1('<p>first</p>'), 
           ajax2('<p>second</p>'), 
           ajax3('<p>third</p>'))
     .then(function(results1, results2, results3) {
        console.log(results1);
        $('.document').append(results1);
        $('.document').append(results2); 
        $('.document').append(results3);         
        alert('all ajax done');
    });
});

function ajax1(data) {

    $.ajax({
        type: 'post',
        url: 'templates/test_template.tmpl',
        data: "data=" + data,
        dataType: 'json',
        success: function (returnedData) {

            $('#resultsDiv').vkTemplate('templates/test_template.tmpl', returnedData, function () {
                //vk callback
                //possibly call my resolve here?
            });
        }
    });
}

function ajax2(data){//more of the same}

1 个答案:

答案 0 :(得分:1)

由于vkTemplate不返回任何内容,您需要手动创建延迟并使用所需数据成功回调它。

function ajax1(data) {
    var dfd = $.Deferred();

    $.ajax({
        type: 'post',
        url: 'templates/test_template.tmpl',
        data: "data=" + data,
        dataType: 'json',
        success: function (returnedData) {

            $('#resultsDiv').vkTemplate('templates/test_template.tmpl', returnedData, function (el, data, context) {
                dfd.resolveWith(context, [$(el)]);
            });
        }
    });

    return dfd.promise();
}