我正在构建一个名为"HTML测验"的东西.它完全使用JavaScript运行,非常酷.
最后,弹出一个结果框,上面写着"你的结果:",它显示了他们花了多少时间,他们得到了多少百分比,以及他们从10中得到了多少问题.我想有一个按钮说"捕获结果"并以某种方式获取屏幕截图或div的某些内容,然后只显示在页面上捕获的图像,他们可以右键单击并"将图像另存为".
我真的很想这样做,所以他们可以与他人分享他们的成果.我不希望他们"复制"结果,因为他们可以很容易地改变它.如果他们改变图像中的内容,那么哦.
有没有人知道这样做的方法或类似的东西？
现在我有一个canvas,我想将其保存为PNG.我可以用所有那些花哨的复杂文件系统API来做,但我真的不喜欢它们.
我知道是否有链接download属性:
<a href="img.png" download="output.png">Download</a>
如果用户点击它,它将下载该文件.所以我想出了这个:
$("<a>")
.attr("href", "img.png")
.attr("download", "output.png")
.appendTo("body")
.click()
.remove();
演示:http://jsfiddle.net/DerekL/Wx7wn/
但是,它似乎不起作用.是否必须由用户操作触发？或者为什么不起作用？
我已经阅读了一些类似的问题和答案,但没有一个完全解决我的问题.
这里是我的情况: 我有什么类似于TinyMCE的(一个家庭BREW版本虽然)一种编辑器.它允许用户输入一些文本,一个或两个图像等.我有代码,它将项目放在那里,并将它们实时渲染成一个较小的div(基本上是一个缩略图).
这就是我想要做的事情 最终,用户可能想在其他地方使用他们的"页面",所以我想让他们去屏幕,查看每个页面的缩略图,然后选择一个.
这是问题 显然,我可以使用相同的缩略图代码来渲染每个页面缩略图.但是,它可能是带宽密集型的(每个页面可能有多个图像,更不用说计算必须多次执行 - 我们在预览页面上可能会说40到50个缩略图).
所以,我想尝试使用缩略图div,并以某种方式创建一个png或jpg,当他们在编辑器中保存页面时(所以页面的代码,也是缩略图),并将其推送到我的PHP脚本将图像保存到服务器.
我的第一个想法是,也许画布可以做到这一点,但是存在将文本和图像首先翻译到画布上的问题,这可能是也可能是不可能的.
就是这样.我对任何和所有选项感兴趣,包括商业图书馆(如果有的话)会这样做 - 唯一的事情是,希望它是在javascript中.