使用JSPdf生成将整个html页面导出为pdf
使用JSPdf生成将整个html页面导出为pdf
提问于 2014-05-08 19:07:32
我已经将这些js文件添加到我的aspx页面。但是我仍然不能得到我的表格数据的pdf文件。生成的pdf是空白的。我需要所有的表格数据生成的pdf .please，如果有人知道怎么做？
<script src="../Script/jspdf.js"></script>
<script src="../Script/FileSaver.js"></script>
<script src="../Script/Blob.js"></script>
<script src="../Script/BlobBuilder.js"></script>
<script src="../Script/deflate.js"></script>
<script src="../Script/adler32cs.js"></script>
<script src="../Script/jspdf.plugin.addhtml.js"></script>
<script src="../Script/jspdf.plugin.from_html.js"></script>
<script src="../Script/jspdf.plugin.split_text_to_size.js"></script>
<script src="../Script/jspdf.plugin.standard_fonts_metrics.js"></script>
<script src="../Script/base64.js"></script>
<script src="../Script/sprintf.js"></script>//下面是我的aspx表或div内容：
<div id="divReport" style="display: none">
<input type="button" id="btnSavePdf" value="Save as Pdf" />
<table id="example">
<tr id="trProject">
<td><span>Project :</span></td>
<td><span id="spanProject" runat="server"></span></td>
</tr>
<tr>
<td><span>Total Number of Employee :</span></td>
<td>
<asp:Label ID="spanTotalEmp" runat="server" EnableViewState="false" ClientIDMode="Static" ></asp:Label>
</td>
</tr>
<tr>
<td><span>Total Number of Hours :</span></td>
<td>
<asp:Label ID="spanTotalHours" runat="server" name="_name2" EnableViewState="false" ClientIDMode="Static" ></asp:Label>
</td>
</tr>
</table>
</div>//下面是我的Javascript按钮onclick代码：
$('#btnSavePdf').click(function () {
var doc = new jsPDF('p', 'in', 'letter');
var source = $('#divReport').html();
var specialElementHandlers = {
'#bypassme': function (element, renderer) {
return true;
}
};
doc.fromHTML(
source, // HTML string or DOM elem ref.
0.5, // x coord
0.5, // y coord
{
'width': 7.5, // max width of content on PDF
'elementHandlers': specialElementHandlers
});
doc.output('dataurl');回答 2
Stack Overflow用户
回答已采纳
发布于 2014-05-08 21:07:58
我假设您只想呈现表格，而不是整个页面。您可以使用HTML table export jQuery plugin来完成此操作。这是您的HTML的外观：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<!-- jQuery 2.0.2 -->
<script type="application/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script type="application/javascript" src="tableExport.js"></script>
<script type="application/javascript" src="jquery.base64.js"></script>
<script type="application/javascript" src="jspdf/libs/sprintf.js"></script>
<script type="application/javascript" src="jspdf/jspdf.js"></script>
<script type="application/javascript" src="jspdf/libs/base64.js"></script>
</head>
<body>
<table id="example">
<!-- rows here -->
</table>
<a href="#" onclick ="$('#example').tableExport({type:'pdf',escape:'false'});">As PDF</a>
</body>
</html>Stack Overflow用户
发布于 2014-05-09 04:20:59
该style="display:none"将阻止它呈现，因此您将得到一个空白页面。
也就是说，我认为您使用的是相当旧的模板，因为sprintf.js和base64.js大约在三年前就被删除了。您应该只需要包含dist文件夹中的一个可用文件。
https://github.com/MrRio/jsPDF/tree/master/dist
下面是一个使用最新版本的fromHTML表格示例：http://jsfiddle.net/dGLmr/7/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/23540022
复制相关文章
相似问题
腾讯云开发者
