在转换为pdf时保留网页的格式

时间:2017-08-23 07:08:44

标签: html pdf printing

我目前在项目中工作,我必须打印一个网页,就像一个包含学生详细信息的表格。当我尝试使用window.print()打印网页时,页面格式会在PDF中发生变化。

如何在PDF中保留网页的原始格式? 请帮我!提前谢谢。

1 个答案:

答案 0 :(得分:0)

jsPDF可以使用插件。为了使其能够打印HTML,您必须包含某些插件,因此必须执行以下操作:

转到jsPDF并下载最新版本。 在项目中包含以下脚本:

  • jspdf.js
  • jspdf.plugin.from_html.js
  • jspdf.plugin.split_text_to_size.js
  • jspdf.plugin.standard_fonts_metrics.js

如果要忽略某些元素,则必须使用ID标记它们,然后可以在jsPDF的特殊元素处理程序中忽略它们。因此,您的HTML应如下所示:

<!DOCTYPE html>
<html>
  <body>
    <p id="ignorePDF">don't print this to pdf</p>
    <div>
      <p><font size="3" color="red">print this to pdf</font></p>
    </div>
  </body>
</html>

然后使用以下JavaScript代码在PopUp中打开创建的PDF:

var doc = new jsPDF();          
var elementHandler = {
  '#ignorePDF': function (element, renderer) {
    return true;
  }
};
var source = window.document.getElementsByTagName("body")[0];
doc.fromHTML(
    source,
    15,
    15,
    {
      'width': 180,'elementHandlers': elementHandler
    });

doc.output("dataurlnewwindow");

对我来说,这创造了一个漂亮而整洁的PDF,其中只包含了这一行&#39;将其打印到pdf&#39;。