我希望能够将特定div打印为PDF和JPG。我在运行phantomjs时使用了以下代码:
var bb = page.evaluate(function() {
return document.getElementsByTagName("fieldset")[7].getBoundingClientRect();
});
page.clipRect = {
top: bb.top,
left: bb.left,
width: bb.width,
height: bb.height
};
这适用于PNG,但对于PDF,它只打印整个页面。有谁知道为什么会这样,以及如何解决它?如果有人知道解决这个问题的任何其他方法,即使是不涉及幻影或某些前端解决方案的事情,如果他们分享,我也会非常感激。
编辑我正在寻找解决此问题的方法,任何前端或后端解决方案都是可以接受的。但是,之前关于此主题的一些问题提供了涉及html2canvas或jsPdf的建议,但那些有解决问题,所以任何其他答案解决方案将不胜感激。
答案 0 :(得分:4)
我需要将div发送给PDF,我使用这段代码并且对我来说很好。 (需要JQuery)。
function testPdf(){
//send the div to PDF
html2canvas($("#DIV_ID_HERE"), { // DIV ID HERE
onrendered: function(canvas) {
var imgData = canvas.toDataURL('image/png');
var doc = new jsPDF('landscape');
doc.addImage(imgData, 'PDF', 10, 10);
doc.save('sample-file.pdf'); //SAVE PDF FILE
}
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.3/jspdf.debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script>
<div id="DIV_ID_HERE">
Test - This div to pdf
<br><input type="button" value="print" onclick="testPdf();">
<div>