html 转成 pdf 进行预览、下载、打印

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');

　　　　}

　　})

}