JS 错误：元素未附加到文档
我尝试使用html2canvas lib将 div 转换为图像，但我不断收到该错误
html2canvas.min.js:20 Uncaught (in promise) Error: Element is not attached to a Document
at html2canvas.min.js:20
at html2canvas.min.js:20
at Object.next (html2canvas.min.js:20)
at html2canvas.min.js:20
at new Promise (<anonymous>)
at a (html2canvas.min.js:20)
at Vs (html2canvas.min.js:20)
at html2canvas.min.js:20
at HTMLInputElement.<anonymous> (index4.html:18)
at HTMLInputElement.dispatch (jquery-2.2.4.min.js:3)
我不明白我的代码有什么问题，当我在 jsfiddle 上运行代码时，它不会给我任何错误，当我在本地系统上运行它时，它会给我错误。
代码
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" ></script>
<script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js"></script>
</head>
<body>
<div id="phone">45454565756677</div>
<div id="out_image"></div>
<input type="button" value="Data to Image" id="data_to_image_btn" >
<script>
$(function() {
$("#data_to_image_btn").click(function() {
html2canvas($("#phone"), { // no error with : document.getElementById( but nothing is rendered
onrendered: function(canvas) {
console.log('done ... ');
$("#out_image").append(canvas);
}
});
});
});
</script>
</body>
</html>
青春有我1回答
-
12345678_0001
尝试这个：html2canvas($("#phone")[0]).then((canvas) => { console.log("done ... "); $("#out_image").append(canvas);});这两个更改是：将 jquery 选择的第一个元素传递给 html2canvas，而不是选择本身。这消除了错误......但要发生某些事情，似乎您需要将调用视为 Promise，而不是传递回调onrendered（这是第二个更改）
随时随地看视频慕课网APP
相关分类
JavaScript