HTML5画布获取div的屏幕截图不起作用答案

【问题标题】：HTML5 canvas get screenshot of a div is not workingHTML5画布获取div的屏幕截图不起作用
【发布时间】：2015-08-14 17:30:44
【问题描述】：

我正在尝试使用 html5 画布将 div 捕获到图像中。我有该 div 的背景图像，因此当尝试以 jpeg 格式下载图像时，它会在没有背景图像的情况下下载。我确定我的域中有该图像，因此无法打破同源规则

HTML

<div id="testdiv" style="background:(path/to/image) no-repat">
</div>

$(document).ready(function() {
//var testdiv = document.getElementById("testdiv");
    html2canvas($("#testdiv"), {
        onrendered: function(canvas) {
            // canvas is the final rendered <canvas> element
            var myImage = canvas.toDataURL("image/png");
            window.open(myImage);
        }
    });
});

为什么它现在在画布上绘制 div 的背景图像？

有什么帮助吗？谢谢

【问题讨论】：

控制台没有错误？
控制台中没有错误。我正在使用 Chrome
不是图片的绝对路径..

标签： javascript jquery css html

【解决方案1】：

您必须将 css 高度设置为您的 div#testdiv，例如：

<div id="testdiv" style="background:(path/to/image) no-repeat; height:700px"></div>

【讨论】：