如何将div的内容保存为图像？ [英] How to save the contents of a div as a image?

问题描述

基本上，我正在执行标题所述的操作，尝试将div的内容保存为图像。

Basically, I am doing what the heading states, attempting to save the contents of a div as an image.

我打算为此创建一个小型在线应用程序iPad。

I plan on making a small online application for the iPad.

必须具备一个保存按钮，可以将整个网页保存为图像，并将该图像保存到iPad的相机胶卷中。我希望保存div的全部内容，而不仅仅是可见区域。

One function that is a must is having a 'Save' button that can save the full webpage as an image, and save that image to the iPad's camera roll. I wish to save the full contents of a div, not just the visible area.

我已经在网上进行了简单搜索，但找不到任何文档。我在HTML5 Canvas上发现了很多。以下是我放在一起的一些代码：

I have searched briefly online, but couldn't find much documentation on anything. I found a lot on HTML5 Canvas. Here is some code I put together:

<script>
function saveimg()
{
    var c = document.getElementById('mycanvas');
    var t = c.getContext('2d');
    window.location.href = image;

    window.open('', document.getElementById('mycanvas').toDataURL());
}
</script>

<div id="mycanvas">
This is just a test<br />
12344<br />
</div>

<button onclick="saveimg()">Save</button>

尽管我得到这个错误：

Although, I am getting this error:

TypeError: c.getContext is not a function

这应用程序将仅用HTML，CSS和jQuery（或其他Javascript库）构建。

This application will be built only with HTML, CSS and jQuery (or other Javascript libraries).

推荐答案

这篇关于如何将div的内容保存为图像？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！