您的位置: 首页  >  技术问答  >  将画布保存为jpg到桌面

将画布保存为jpg到桌面

分类: 技术问答 • 2022-03-25 18:37:21

将画布保存为jpg到桌面

问题描述：

我尝试从HTML5canvas将图片（JPEG）保存到桌面。我可以在一个新窗口中打开 window.open（canvas.toDataURL（'png'），）; ，但是如何保存到桌面？感谢。

I am trying to save an image (JPEG) to the desktop from an HTML5canvas. I can open in a new window window.open(canvas.toDataURL('png'), "");, but how can I save it to the desktop? Thanks.

答

下载属性



href =http://caniuse.com/#search=download%20attribute>下载属性，允许您为链接指定文件名。

Download attribute

There is a new download attribute in HTML5 that allow you to specify a file-name for links.

我这样做是为了节省画布。它有一个链接（下载为图片） -

I made this for saving canvas. It has a link ("Download as image") -

<a id="downloadLnk" download="YourFileName.jpg">Download as image</a>

而且函数：

function download() {
    var dt = canvas.toDataURL('image/jpeg');
    this.href = dt;
};
downloadLnk.addEventListener('click', download, false);

您甚至可以通过设置属性 downloadLnk来动态更改文件名。 download ='myFilename.jpg'。

You can even change the file-name dynamically by setting the attribute downloadLnk.download = 'myFilename.jpg'.

演示 。

Demo from the archives.

相关推荐