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. NSIS程序安装包制作

    nsis下载地址:http://www.pc6.com/softview/SoftView_14342.html nsis使用: 启动NSIS程序主界面,选择"可视化脚本编辑器(VNISEd ...

  2. ftpdata目录下日期目录权限问题

    由于APP Server由root用户启动,创建目录默认为root:root用户:用户组权限 需chown -R wingupload ftpdata执行后,WING才能上传成功 或者写成脚本,每天凌 ...

  3. Linux内核源码分析--内核启动之(5)Image内核启动(rest_init函数)(Linux-3.0 ARMv7)【转】

    前面粗略分析start_kernel函数,此函数中基本上是对内存管理和各子系统的数据结构初始化.在内核初始化函数start_kernel执行到最后,就是调用rest_init函数,这个函数的主要使命就 ...

  4. pl sql 记住用户名密码

    tools--Preferences--Logon History 选择  “Store history”是默认勾选的,勾上“Store with password” 登录时从下拉框选择用户名则自动登 ...

  5. python实现简单登陆流程

    登陆流程图: 代码实现: #-*- coding=utf-8 -*- import os,sys,getpass ''' user.txt 格式 账号 密码 是否锁定 错误次数 jack 123 un ...

  6. 转载:编译安装Nginx(1.5.1)《深入理解Nginx》(陶辉)

    原文:https://book.2cto.com/201304/19618.html 1.5 configure详解 可以看出,configure命令至关重要,下文将详细介绍如何使用configure ...

  7. 内存分配方式,堆区,栈区,new/delete/malloc/free

    1.内存分配方式 内存分配方式有三种: [1]从静态存储区域分配.内存在程序编译的时候就已经分配好,这块内存在程序的整个运行期间都存在.例如全局变量,static变量. [2]在栈上创建.在执行函数时 ...

  8. dubbo作为消费者注册过程分析--????

    请支持原创: http://www.cnblogs.com/donlianli/p/3847676.html   作者当前分析的版本为2.5.x.作者在分析的时候,都是带着疑问去查看代码,debug进 ...

  9. 如何从现有版本升级到element UI2.0?使用npm-check-updates

    转:https://blog.csdn.net/wojiaomaxiaoqi/article/details/78428738 登录element UI官网时提示2.0已经正式发布了,Element ...

  10. better-scroll插件

    参考网址:慕课网  http://coding.imooc.com/lesson/74.html#mid=1640 这个详细:https://zhuanlan.zhihu.com/p/25369923 ...