Question

我正在将画布转换为可能正常工作的图像。

但是图片在新窗口中打开而不是直接下载。

如何帮助我实现这一目标？

HTML：

<div class="sixteen columns">
    <br />
        <canvas id="qrcodeCanvas"></canvas>
        <br /><br />
        <div class="button qrDownload">Download</div>
    </div>

JQuery的：

 $(".qrDownload").click(function (event) {
        var canvas = document.getElementById("qrcodeCanvas");
        var img = canvas.toDataURL("image/png");
        document.write('<img src="' + img + '"/>');
    });

Answer 1

试试这个：

$(".qrDownload").click(function (event) {
    var html="<p>Right-click on image below and Save-Picture-As</p>";
    html+="<img src='"+canvas.toDataURL()+"' alt='from canvas'/>";
    var tab=window.open();
    tab.document.write(html);
});

同时

如果您在画布上从另一个域中绘制图像而导致跨域安全问题，则
.toDataURL将失败。

Answer 2

var c = document.getElementById("popup");
var link = document.getElementById('cropImageLink');
// link.setAttribute('download', 'MintyPaper.png');
link.setAttribute('href', c.toDataURL("image/png").replace("image/png", "image/octet-stream"));
link.click();
link.open();

之后你可以在下面添加以在新窗口中打开。如果你删除评论，那么使用window.open（）进行其他明智的下载。它应该在新窗口中打开。

图像到窗口打开窗口不下载

2 个答案: