Question

我正在尝试在点击上创建屏幕截图并将图像保存在电脑中。为此，我使用的是html2canvas插件。这是我的代码

<body id="add" style="background-color: white">       
    <label id="contact" style="float: right; cursor: pointer;">Save Me</label>
    <h4>My Name Is <b>SUBHAJYOTI</b> <span style="color:red">MITRA</span></h4>        
    <script>
        $(function() {
            $('#contact').on('click', function() {
                html2canvas($("#add"), {
                    onrendered: function(canvas) {
                        var link = document.createElement('a');
                        link.download = "ScreenShot.jpeg";
                        link.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
                        link.click();
                    }
                })
            });
        });          
    </script>
</body>

点击＆＃34;保存我＆＃34;并保存图像。但是图像的背景变黑了。 enter image description here 如上图所示。请任何人帮助我。

Answer 1

是的，我解决了这个问题。我不知道为什么，但问题是与jpeg。如果我用png更改扩展名jpeg，那么问题就解决了。

link.download = "ScreenShot.png";
link.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");

使用Html2canvas保存canvas元素时出错

1 个答案: