使用Javascript从div中的HTML生成pdf
使用Javascript从div中的HTML生成pdf
提问于 2013-08-13 00:18:32
我有以下html代码：
<!DOCTYPE html>
<html>
<body>
<p>don't print this to pdf</p>
<div id="pdf">
<p><font size="3" color="red">print this to pdf</font></p>
</div>
</body>
</html>我所要做的就是将div中找到的id为" pdf“的内容打印到pdf。这必须使用JavaScript来完成。然后自动下载"pdf“文档，文件名为"foobar.pdf”。
我一直使用jspdf来做这件事，但它唯一的函数是"text“，它只接受字符串值。我想把HTML提交给jspdf，而不是文本。
回答 10
Stack Overflow用户
发布于 2015-11-24 18:04:38
这是一个简单的解决方案。这对我很有效。您可以使用javascript打印概念，并简单地将其保存为pdf。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$("#btnPrint").live("click", function () {
var divContents = $("#dvContainer").html();
var printWindow = window.open('', '', 'height=400,width=800');
printWindow.document.write('<html><head><title>DIV Contents</title>');
printWindow.document.write('</head><body >');
printWindow.document.write(divContents);
printWindow.document.write('</body></html>');
printWindow.document.close();
printWindow.print();
});
</script>
</head>
<body>
<form id="form1">
<div id="dvContainer">
This content needs to be printed.
</div>
<input type="button" value="Print Div Contents" id="btnPrint" />
</form>
</body>
</html>Stack Overflow用户
发布于 2013-08-28 21:57:30
您可以使用autoPrint()并将输出设置为'dataurlnewwindow‘，如下所示：
function printPDF() {
var printDoc = new jsPDF();
printDoc.fromHTML($('#pdf').get(0), 10, 10, {'width': 180});
printDoc.autoPrint();
printDoc.output("dataurlnewwindow"); // this opens a new popup, after this the PDF opens the print window view but there are browser inconsistencies with how this is handled
}Stack Overflow用户
发布于 2018-03-10 01:48:32
如果你需要下载一个特定页面的pdf文件，只需添加这样的按钮
<h4 onclick="window.print();"> Print </h4>使用window.print()打印所有页面，而不仅仅是一个div
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18191893
复制相关文章
相似问题