使用 jsPDF 将 HTML 输入值导出为 PDF答案

【问题标题】：Exporting HTML input values to PDF using jsPDF使用 jsPDF 将 HTML 输入值导出为 PDF
【发布时间】：2018-01-07 12:57:27
【问题描述】：

我有一个 HTML 表单，其中包含多个复选框类型的用户输入字段、文本区域和单选按钮，我需要将其作为 PDF 文件下载，其中包含用户给出的输入值。我成功使用 jsPDF 将 HTML div 导出为 PDF，但输入字段在 PDF 结果中没有任何值。如何使用输入值导出整个表单？这是我用于导出为 PDF 的 jsPDF javascript：

self.onDownload = function (divId){
     var doc = new jsPDF();
     doc.fromHTML(document.getElementById(divId), 15, 15, {
          'width': 170
     });
     doc.save('sample-file.pdf');
}

【问题讨论】：

我在 jsPDF 库 rawgit.com/MrRio/jsPDF/master/docs/index.html 中找不到关于 fromHTML 函数的任何文档，我能找到的最接近的东西是 addHTML 函数，它已被弃用以支持基于矢量的解决方案，此处发布了一个示例：cdn.rawgit.com/MrRio/jsPDF/master/examples/html2pdf/… 我会考虑查看文档和此示例，而不是使用未记录/严重弃用的函数。

标签： javascript jspdf

【解决方案1】：

我本人一直在构建您所描述的功能。

关于您遇到的问题，我目前的理解是大多数 PDF 生成库，如 jsPDF，无法读取/解释输入字段的值属性，这就是它们没有出现在 PDF 中的原因。

解决此问题的一种方法是使用 DOM 到图像生成器，然后将图像保存为 PDF。虽然它不是最优雅的解决方案，但它确实有效，并且是我迄今为止找到的最佳解决方案。我一直在使用 html2canvas 库来创建图像，并使用 jsPDF 来创建 pdf。

有一个教程here，它带你通过使用html2canvas 和jsPDF 设置一个基本的html 到pdf 功能。

【讨论】：

【解决方案2】：

这似乎是错误的，尽管是一年之后。

通过使用

doc.text(20, 20, document.getElementById("YourDiv/Paragraph").innerHTML);

或

document.getElementById("InputField").value

我可以正确使用 html 文件中的元素。

将其保留在此处以避免将来出现混淆。对于此处询问的变量： Variables in jsPDF

【讨论】：