回调/承诺无法正常工作

Question

我有这样的代码：

function makeDiv(callback){
    var dfd = jQuery.Deferred();
    $(function() {
        $("#full_complete").append($(dose_credit).html()+ " " +$(storyboard).html() + " " +$(nar_name).html() + " " +$(nar_text).html());
        full = $(this).closest('div').find("#full_complete");
        dfd.resolve( "hurray" );
    })
     return dfd.promise();
}
function generateImg2(){
var doc = new jsPDF();
doc.fromHTML($(full).get(0), 15, 15, {
    'width': 170, 
});
doc.save('Test.pdf');
}

我用它来调用这些函数：

 $.when(makeDiv()).then(generateImg2());

这将生成一个空白 PDF，因为表示#full_complete full尚未完全创建。这就是为什么我希望使用回调，但它显然不起作用，因为这两个函数基本上同时触发。

我在这里做错了什么？我想这就是我设置承诺的方式，但不确定如何解决它。

Answer 1

Deferred允许您进行异步操作。为此，将您的内部函数包含在setTimeout中，以完全模拟异步操作：

function makeDiv(callback){
    var dfd = jQuery.Deferred();
    setTimeout(function() {
        $("#full_complete").append($(dose_credit).html()+ " " +$(storyboard).html() + " " +$(nar_name).html() + " " +$(nar_text).html());
        full = $(this).closest('div').find("#full_complete");
        dfd.resolve( "hurray" );
    }, 0);
     return dfd.promise();
}

这样做，您将在解析之前返回promise。

还有一种利用承诺链接性质的替代方法：

function makeDiv(callback){
    var dfd = jQuery.Deferred();
    setTimeout(function() {
        dfd.resolve( "hurray" );
    }, 0);
     return dfd.promise();
}
makeDiv().then(function(result) {
  console.log(result); //hurray
  $("#full_complete").append($(dose_credit).html()+ " " +$(storyboard).html() + " " +$(nar_name).html() + " " +$(nar_text).html());
  full = $(this).closest('div').find("#full_complete");
});

更进一步，您可以编写一个帮助程序来确保代码的async性质：

function async(){
    var dfd = jQuery.Deferred();
    setTimeout(function() {
        dfd.resolve();
    }, 0);
     return dfd.promise();
}
async().then(function() {});