我使用图像将图片加载到 Canvas 上。
然后我希望我的用户能够选择将图像保存到他们的硬盘上。
我进行了搜索,如果我使用 Ajax 并从我的服务器检索,有很多方法可以做到这一点。
有没有办法避免访问我的服务器并通过图像控件或 Canvas 控件直接保存到我的硬盘上
最佳答案
使用HTML5 download attribute实际上可以得到您想要的效果.
步骤是:
- 使用 Canvas 创建图像
- 附加带有
download
属性的不可见链接 - 触发链接
onclick
事件 - 删除隐藏链接
类似这样的事情:
myCanvas = document.getElementById("myCanvas");
$("body").append("<a id='hiddenLink' href='" + myCanvas.toDataURL() + "' style='display:none;' download>Download Pic</a>");
$("#hiddenLink")[0].click();
$("#hiddenLink").remove();
您可以在这里看到它的工作情况:http://jsfiddle.net/wLd4yf7k/
一个问题:并非所有浏览器都支持它:http://caniuse.com/#feat=download
<小时/>这里您有一个仅使用 JavaScript(无 jQuery)的解决方案,因为我发现您没有在问题中添加 jQuery 标签:
myCanvas = document.getElementById("myCanvas");
a = document.createElement("a");
a.href = myCanvas.toDataURL();
a.download = "download";
a.click();
你可以看到它在 fiddle 上工作:http://jsfiddle.net/wLd4yf7k/1/
关于javascript - 将图像保存到硬盘,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29033854/