html 页面转成 pdf,直接看代码;

参考地址: https://github.com/linwalker/render-html-to-pdf

给出代码 方便粘贴:

var downPdf = document.getElementById("pdfDownLoad"); // 点击的按钮
var pdfDom = document.getElementById('tableInfoShow') // 生成 pdf 的区域
downPdf.onclick = function () {
  html2canvas(pdfDom, {
  onrendered: function (canvas) {
    var contentWidth = canvas.width
    var contentHeight = canvas.height
    var pageHeight = contentWidth / 592.28 * 841.89
    var leftHeight = contentHeight
    var position = 0
 
    // var imgWidth = 595.28
    var imgWidth = 900
    var imgHeight = 900 / contentWidth * contentHeight
    var pageData2 = canvas.toDataURL('image/jpeg', 1.0)
    var PDF = new jsPDF('', 'pt', 'a4')
    //PDF.addImage(pageData2, 'JPEG', 0, 0, 595.28, 592.28/canvas.width * canvas.height );
    if (leftHeight < pageHeight) {
      PDF.addImage(pageData2, 'JPEG', -150, -5, imgWidth, imgHeight)
      // PDF.addImage(pageData2, 'JPEG', 0, 0, imgWidth, imgHeight)
    } else {
    while (leftHeight > 0) {
      PDF.addImage(pageData2, 'JPEG', 0, position, imgWidth, imgHeight)
      leftHeight -= pageHeight
      position -= 841.89
 
      //position -= 851
      if (leftHeight > 0) {
        PDF.addPage()
      }
    }
  }
    PDF.save('研究生考核表' + '.pdf');
    }
  })
}

html 转成 pdf 进行预览、下载、打印的更多相关文章

  1. java 文件转成pdf文件 预览

    一.前端代码 //预览功能 preview: function () { //判断选中状态 var ids =""; var num = 0; $(".checkbox& ...

  2. C#调用WPS将文档转换成pdf进行预览

    引用:https://www.jianshu.com/p/445996126c75 vs启动项目可以生成wps实例 本地iis部署的站点却不行 原因是vs是管理员权限,而iis没有权限 解决方法 启动 ...

  3. java原装代码完成pdf在线预览和pdf打印及下载

    这是我在工作中,遇到这样需求,完成需求后,总结的成果,就当做是工作笔记,以免日后忘记,当然,能帮助到别人是最好的啦! 下面进入正题: 前提准备: 1. 项目中至少需要引入的jar包,注意版本: a)  ...

  4. 实战动态PDF在线预览及带签名的PDF文件转换

    开篇语: 最近工作需要做一个借款合同,公司以前的合同都是通过app端下载,然后通过本地打开pdf文件,而喜欢创新的我,心想着为什么不能在线H5预览,正是这个想法,说干就干,实践过程总是艰难的,折腾了3 ...

  5. 动态PDF在线预览

    实战动态PDF在线预览及带签名的PDF文件转换 开篇语: 最近工作需要做一个借款合同,公司以前的合同都是通过app端下载,然后通过本地打开pdf文件,而喜欢创新的我,心想着为什么不能在线H5预览,正是 ...

  6. Office在线预览及PDF在线预览的实现方式史上最全大集合

    Office在线预览及PDF在线预览的实现方式大集合 一.服务器先转换为PDF,再转换为SWF,最后通过网页加载Flash预览 微软方:利用Office2007以上版本的一个PDF插件SaveAsPD ...

  7. Aspose office (Excel,Word,PPT),PDF 在线预览

    前文: 做个备份,拿的是试用版的 Aspose,功能见标题 代码: /// <summary> /// Aspose office (Excel,Word,PPT),PDF 在线预览 // ...

  8. 网站开发进阶(十二)JS实现打印功能(包括打印预览、打印设置等)

    JS实现打印功能(包括打印预览.打印设置等) 绪 最近在进行项目开发时,需要实现后台管理端打印功能,遂在网上一阵搜索,搜到了很多相关的文章.其中绝大部分文章都是使用的Lodop5.0(Web打印和套打 ...

  9. PDF文件预览和下载

    背景:项目中实现pdf文件的预览以及下载 环境:jdk1.8.SpringBoot2.0.Maven    PDF.js下载地址将下载的源码拷入项目中    修改viewer.js: 将default ...

随机推荐

  1. Python 成仙之路

    这个部分的所有内容,都是我学习Python过程中的学习笔记. 这个部分的所有内容,都是我学习Python过程中的学习笔记. 这个部分的所有内容,都是我学习Python过程中的学习笔记. 第一部分  p ...

  2. Jetson tk1 刷机教程

    前期准备: 1.  Jetson TK1开发板. 2.  安装有ubuntu系统的PC(或者ubuntu虚拟机)切记:不管是PC还是虚拟机,务必确保有大于5G的存储空间,之后安装过程会作详细解释. 3 ...

  3. Python3 configparse模块(配置)

    ConfigParser模块在python中是用来读取配置文件,配置文件的格式跟windows下的ini配置文件相似,可以包含一个或多个节(section),每个节可以有多个参数(键=值). 注意:在 ...

  4. windows系统中hosts文件位置

    C:\Windows\System32\drivers\etc\hosts 10.0.0.213 mr1.bic.zte.com 10.0.0.2 mr2.bic.zte.com 10.0.0.102 ...

  5. setfacl报错Operation not supported

    对文件目录setfacl权限设置时报错Operation not supported Google一下,发现是分区acl权限问题 一般情况下(ext4),默认acl支持都是加载的.但如果遇到二般情况, ...

  6. MySQL占用IO过高解决方案【转】

    1.日志产生的性能影响: 由于日志的记录带来的直接性能损耗就是数据库系统中最为昂贵的IO资源.MySQL的日志包括错误日志(ErrorLog),更新日志(UpdateLog),二进制日志(Binlog ...

  7. oracle数据库自增主键重复

    select max(t.id) from T_PLAT_ENUM_VALUE tdrop sequence T_PLAT_ENUM_VALUE;create sequence T_PLAT_ENUM ...

  8. Vue.js——component(组件)

    概念: 组件(Component)是自定义元素. 作用: 可以扩展HTML元素,封装可重用的代码. <div id="myView"> <!-- 把学生的数据循环 ...

  9. iptables实现网络防火墙及地址转换

    iptables主机防火墙功能及常用命令 FSM:Finite State Machine 有限状态机 客户端:closed -->syn_sent -->established --&g ...

  10. tomcat多项目

    在一个tomcat下面布置2个项目 项目的访问路径: http://localhost:8081/ http://localhost:8082/ 1.建立两个站点(虚拟目录,目录中必须包含必要的配置文 ...