Question

我试图用html2canvas中的图像捕获单个网页。

这是我的代码：

<html>
<head>
<script src="html2canvas.js"></script>
<script src="jquery.js"></script>
</head>
<body>
<div id="body" style='height: 36mm;width: 60mm;color: rgb(0, 0, 0);font-family: Titr;border-color: initial;border-style: 
solid;border-width: 12px 34px 21px 14px;-webkit-border-image: url("1.png") 125 346 219 148 fill stretch;border-image-source: url("1.png");
border-image-slice: 125 346 219 148 fill;border-image-width: initial;border-image-outset: initial;border-image-repeat: stretch;position: relative;' class="box">
 </div>

    <input type="button" name="print" />
</html>


<script>
    $(document).on('click', "[name='print']", function () {
        html2canvas(document.body, {
            letterRendering: true,
            logging: true,
            background :'#FFFFFF',
            onrendered: function (canvas) {
                var a = document.createElement('a');
                // toDataURL defaults to png, so we need to request a jpeg, then convert for file download.
                a.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
                a.download = 'somefilename.jpg';
                a.click();
            }
        });

    });
</script>

和网页结果：

和html2canvas图片的结果：

所有文件都位于相同的文件夹和位置。

html2canvas BlackBox而不是Image

0 个答案: