jspdf 打印多页时两边取消留白_jsPDF 导出html为pdf内容截断终极解决方案

我们都知道jsPDF配合html2canvas可以将html转化为canvas，然后将canvas转为图片，最后使用jspdf将图片放到pdf中去，实现前端的pdf下载，很方便。但是我们在使用过程中会出现这样的情况，将图片放在一页，如果不超过A4纸大小(主要是高度)，就没有问题，但是高度超过了，我们就必须放多页，但是放多页内容会被无情截断。

我们要实现的目标：不截断pdf，且内容完整

本人经过研究jspdf之后，整理了将html转为pdf，内容一页显示不截断的思路和代码：

思路

获取DOM

将DOM转换为canvas

获取canvas的宽度、高度(稍微大一点，预览)

将pdf的宽高设置为canvas的宽高(不适用A4纸大小)

将canvas转为图片

实例化jspdf，将内容图片放在pdf中(因为内容宽高和pdf宽高一样，就只需要一页，也防止内容截断问题)

代码

document.querySelector('.download button').onclick = function(e) {

var content = document.querySelector('.content')

download(content)

}

function download(content) {

html2canvas(content, {

allowTaint: true,

scale: 2 // 提升画面质量，但是会增