Question

在我的javascript中，我绘制到画布上，之后我将画布转换为png，并在div中显示以下代码：

var dataURL = document.getElementById('myCanvas').toDataURL("image/png");
var imgObj = new Image();
imgObj.src = dataURL;
imgObj.onload = function() {document.getElementById('myImg').appendChild(imgObj); };

当我在绘制画布后直接调用它时，我在“myImg”中得到一个完整的空白图像，但是如果我通过点击链接调用完全相同的代码就可以正确绘制：

<a id="viewImgLnk" href="javascript:void()" onclick=" return convertCanvasToImage();">View Image</a>

<script>
    function convertCanvasToImage(){
        var dataURL = document.getElementById('myCanvas').toDataURL("image/png");
        var imgObj = new Image();
        imgObj.src = dataURL;
        imgObj.onload = function() {document.getElementById('myImg').appendChild(imgObj); };
    }
</script>

如何在没有链接的情况下直接加载图片？

Answer 1

我在过敏的帮助下得到了代码！

setTimeout(function() {
    var dataURL = document.getElementById('myCanvas').toDataURL("image/png");
    var imgObj = new Image();
    imgObj.src = dataURL;
    imgObj.onload = function() {document.getElementById('myImg').appendChild(imgObj); };
}, 300);

Javascript - 如何等待图像加载？不能让img.load工作吗？

1 个答案: