使用 JavaScript 从 DataURI 同步创建图像对象答案

【问题标题】：Synchronously Create Image Object from DataURI using JavaScript使用 JavaScript 从 DataURI 同步创建图像对象
【发布时间】：2013-11-03 06:29:41
【问题描述】：

有谁知道是否可以使用 JavaScript 从数据 uri 同步创建图像对象？可以像这样从数据 URI 异步创建图像对象：

            imageObj = new Image();
            imageObj.onload = function() {
                callback(imageObj);
            };
            imageObj.src = dataURI;

您可能认为这会起作用：

            imageObj = new Image();
            imageObj.src = dataURI;
            callback(imageObj);

但如果我没记错的话，这在某些浏览器中会失败。

想法？

【问题讨论】：

第一个例子发生了什么？应该在更改源之前定义 onload 函数

标签： javascript image uri data-uri

【解决方案1】：

我认为您可以使用Image 对象的complete 属性。

http://www.w3schools.com/jsref/prop_img_complete.asp

在调用callback函数之前，可以循环不断地检查complete是否为true。一旦它为真，它就会被加载。

【讨论】：

我希望找到一种方法来立即将数据 URI 更改为图像对象。在我看来，使用轮询技术来确定图像是否已加载比挂钩 onload 事件更糟糕。