image.src = canvas.toDataURL（“ image / png”）;保存问题

Question

如何在相机div中保存image.src = canvas.toDataURL("image/png"); onclick相机结果会自动保存在第一张图像src行中。

Working Codepen

Answer 1

您正在编辑第一个img标签。但是您需要编辑第二个。

将let image = document.querySelector("img");更改为let image = document.getElementById("result");

和

将<img src="" alt="" class="image image--hidden" />更改为<img src="" id="result" alt="" class="image image--hidden" />

Answer 2

如果我的理解正确，您想在click上下载图像。为此，您应该使用<a />标签。请尝试以下操作：

function save(){

    let a = document.createElement('a');

    a.download = '';

    a.href = canvas.toDataURL("image/png");

    a.click();
}

现在，您可以随时使用save函数，甚至可以使用onclick。