Javascript jsPDF fromHTML() 不显示 HTML
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29217739/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jsPDF fromHTML() does not show HTML
提问by Gabrio
Im working at a simple javascript. im using the jsPDF lib but the script load a blank pdf.
我在一个简单的 javascript 工作。我使用的是 jsPDF 库，但脚本加载了一个空白的 pdf。
this is the code :
这是代码：
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>fromHTML EX</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 1.22" />
<script type="text/javascript" src="/root/utils/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.standard_fonts_metrics.js"></script>
<script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.split_text_to_size.js"></script>
<script type="text/javascript" src="/root/utils/jsPDF-master1/js/basic.js"></script>
<script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.js"></script>
<script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.from_html.js"></script>
<script type="text/javascript">
function PDF1(){
var doc = new jsPDF();
var elementHandler = {
'#ignorePDF': function (element, renderer) {
return true;
}
};
var source = window.document.getElementsByTagName("body")[0];
doc.fromHTML(
source,
15,
15,
{
'width': 180,'elementHandlers': elementHandler
});
doc.output("datauri");
}
PDF1()
</script>
</head>
<body>
ASDSADASDASDSA
<div>
<p id="ignorePDF">don't print this to pdf</p>
<p><font size="3" color="red">print this to pdf</font></p>
</div>
</body>
</html>
i have tryied to put the calling function at the bottom of the page but it still don't work. Can someone help me?
我已经尝试将调用函数放在页面底部，但它仍然不起作用。有人能帮我吗？
回答by talves
Since you are using jQuerytry:
由于您正在使用jQuery尝试：
$( document ).ready(function() {
//console.log( "ready!" );
PDF1();
});
Also Note:You could use (not required):
另请注意：您可以使用（非必需）：
var source = $("body")[0];
Code page used to test
用于测试的代码页
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>fromHTML EX</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 1.22" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://parall.ax/parallax/js/jspdf.js"></script>
<script type="text/javascript">
function PDF1(){
var doc = new jsPDF();
var elementHandler = {
'#ignorePDF': function (element, renderer) {
return true;
}
};
var source = window.document.getElementsByTagName("body")[0];
doc.fromHTML(
source,
15,
15,
{
'width': 180,'elementHandlers': elementHandler
});
doc.output("datauri");
}
$( document ).ready(function() {
//console.log( "ready!" );
PDF1();
});
</script>
</head>
<body>
ASDSADASDASDSA
<div>
<p id="ignorePDF">don't print this to pdf</p>
<p><font size="3" color="red">print this to pdf</font></p>
</div>
</body>
</html>
回答by Prem Kumar Nayak
This code can also be used for exporting to pdf using jsPDF.
此代码还可用于使用 jsPDF 导出为 pdf。
var pdf = new jsPDF('p','pt','a4');
let pdfConf = {
pagesplit: true, //Adding page breaks manually using pdf.addPage();
background: '#fff' //White Background.
};
pdf.fromHTML($('#capture').get(0),20,20,{
width:500
})
pdf.save("download.pdf");
