指定html转pdf文档

1.资源

<script type="text/javascript" src="./js/canvg2.js"></script>

<script type="text/javascript" src="./js/html2canvas-0.4.1.js"></script>

<script type="text/javascript" src="./js/jspdf.min.js"></script>

<script type="text/javascript" src="./js/jquery-2.1.4.min.js"></script>

2.主要代码

function changeImg(target) {

$('body').find('canvas').each(function (i, v) {

var imgSrc = v.toDataURL("image/png");

$(v).prop('outerHTML', '<img src="' + imgSrc + '" /> ');

});

var targetDom = $(target);

var copyDom = targetDom.clone();

copyDom.width(targetDom.width() + "px");

copyDom.height(targetDom.height() + "px");

$('body').append(copyDom);

svg2canvas(copyDom);

html2canvas(copyDom, {

onrendered: function (canvas) {

var imgData = canvas.toDataURL('image/jpeg');

var img = new Image();

img.src = imgData;

img.onload = function () {

if (this.width > this.height) {

var doc = new jsPDF('l', 'mm', [this.width * 0.225, this.height * 0.225]);

} else {

var doc = new jsPDF('p', 'mm', [this.width * 0.225, this.height * 0.225]);

}

doc.addImage(imgData, 'jpeg', 0, 0, this.width * 0.225, this.height * 0.225);

doc.save(getQueryString('name', decodeURIComponent(location.href)) + '.pdf');

};

copyDom.remove();

},

background: "#fff",

allowTaint: true

});

}

function svg2canvas(targetElem) {

var svgElem = targetElem.find('svg');

svgElem.each(function (index, node) {

var parentNode = node.parentNode;

var tempNode = document.createElement('div');

tempNode.appendChild(node);

var svg = tempNode.innerHTML;

var canvas = document.createElement('canvas');

canvg(canvas, svg);

parentNode.appendChild(canvas);

});

}

3.参考资源

Javascript 将html转成pdf,下载,支持多页哦（html2canvas 和 jsPDF）

纯js实现html转pdf