用js 将当前html页面导出pdf
2018-01-07 16:45
555 查看
引入的js
<script src="./js/libs/jquery-2.0.2.js"></script>
<script src="./js/exportpdf/jspdf.debug.js"></script>
<script src="./js/exportpdf/html2canvas.js"></script>
html2canvas 是将当前页面转换成图片;
$('#appmsg') 是要转换为图片的页面范围;
height:5000,这个高度要根据页面的大小灵活调整;
var doc = new jsPDF('p', 'px','a3'); p:横向,a3:纸张大小,默认是a4;
doc.addImage(imgData, 'PNG', -9, 0,650,1500);将转换后的图片放到pdf文档上,后面四个参数可根据实际效果灵活调整;
doc.addPage(); 一页pdf显示不完整的时候,新增一页;
参考链接 http://blog.csdn.net/w20228396/article/details/55258544
<script src="./js/libs/jquery-2.0.2.js"></script>
<script src="./js/exportpdf/jspdf.debug.js"></script>
<script src="./js/exportpdf/html2canvas.js"></script>
1. function downloadPdf(){ 2. html2canvas($('#appmsg'), { //appmsg 为选择要导出的页面id样式 3. height:3000, 4. onrendered: function(canvas) { 5. var imgData = canvas.toDataURL('img/notice/png'); 6. var doc = new jsPDF('p', 'px','a4'); 7. //第一列 左右边距 第二列上下边距 第三列是图片左右拉伸 第四列 图片上下拉伸 8. doc.addImage(imgData, 'PNG', 10, 0,420,0); 9. doc.addPage(); //增加新一页 10. doc.addImage(imgData, 'PNG', 10, 0,420,0); 11. doc.save('test.pdf'); 12. } 13. });
html2canvas 是将当前页面转换成图片;
$('#appmsg') 是要转换为图片的页面范围;
height:5000,这个高度要根据页面的大小灵活调整;
var doc = new jsPDF('p', 'px','a3'); p:横向,a3:纸张大小,默认是a4;
doc.addImage(imgData, 'PNG', -9, 0,650,1500);将转换后的图片放到pdf文档上,后面四个参数可根据实际效果灵活调整;
doc.addPage(); 一页pdf显示不完整的时候,新增一页;
参考链接 http://blog.csdn.net/w20228396/article/details/55258544
相关文章推荐
- JS 如何将 HTML 页面导出为多页 PDF
- JS 如何将 HTML 页面导出为 PDF
- jspdf + highcharts 实现导出存在highcharts图表的html页面
- 将HTML页面部分内容导出为PDF
- php dompdf包如何将HTML页面导出中文无乱码的PDF文档
- js得到当前屏幕长宽与页面html长度
- IText&Html2canvas js截图 绘制 导出PDF
- html to pdf - 使用Wkhtmltopdf.exe - 实现,可导出需登录的页面
- js如何获取当前页面字符编码? http://bbs.51js.com/thread-75687-1-1.html
- html页面中js获取当前url下指定参数的值
- 简单的jQuery.jqprint插件实现打印HTML页面,页面导出为PDF文件
- ASP.NET C#根据HTML页面导出PDF
- js输入当前页面的HTML代码
- JS实现HTML页面中动态显示当前时间完整示例
- js 实现html 页面导出excel
- ASP.NET C#根据HTML页面导出PDF
- js实现html页面转为pdf下载
- JS刷新当前页面的几种方法总结
- JS获取当前页面的URL等信息
- html页面表格导出到excel总结