0

我想创建一个包含多个图像的 PDF 文档。由于它们是从网络服务器加载的，因此我异步执行此操作。当所有图像都加载并添加到文档中时，我想显示结果。

// create a new document
var doc = new jsPDF();

var count = 0;
for (var i = 0; i < urls.length; ++i) {
    // load image from url and add to document
    // internally, waits for img.onload()
    image(urls[i], function(e) {
        // don't care about the coordinates,
        // I simplified this for this example
        doc.addImage(e.data, 'jpeg', 0, 0, 10, 10);
        // increase counter of finished callbacks
        count++;
    });
}

// wait for all callbacks to finish
while (count < urls.length);

// output the resulting document
doc.output('dataurl');

当我运行此代码时，浏览器窗口会冻结几秒钟，然后停止执行脚本。似乎while循环没有完成。

我的代码有什么问题？我认为必须有一种方法可以在 JavaScript 中的某些位置同步您的代码。这通常是如何完成的？

4

1 回答 1

0

谢谢伊恩，为我指出了诺言。因为我已经使用了 jQuery，所以我决定使用它们的实现。加载函数现在image()返回一个承诺，这就是我最终得到的。

// create a new document
var doc = new jsPDF();

// load all images and give me the promises
var promises = urls.map(image);

// handle individual results
promises.map(function(promise) {
    promise.done(function(e) {
        // don't care about the coordinates,
        // I simplified this for this example
        doc.addImage(e.data, 'jpeg', 0, 0, 10, 10);
    }).fail(console.log);
});

// handle overall readiness
$.when.apply($, promises).done(function() {
    // output the resulting document
    doc.output('dataurl');
}, console.log);
于 2014-03-04T10:55:29.497 回答