html2canvas - 带有空输入字段的 html2pdf答案

【问题标题】：html2canvas - html2pdf with empty input fieldshtml2canvas - 带有空输入字段的 html2pdf
【发布时间】：2021-01-22 05:04:11
【问题描述】：

我正在使用 eKoopmans html2pdf.js 库在提交表单后创建 PDF。这一切在所有浏览器和所有设备上都能完美运行，但在 iOS 上却不行。

我有一个问题，我的所有输入字段都没有呈现它的值。输入字段只是空的。我正在使用以下代码创建 PDF。

var element = document.getElementById('testtest');
      opt = {             margin: 0.05,
        filename:     'myfile.pdf',
        image:        { type: 'jpeg', quality: 0.98 },
        jsPDF:        { unit: 'in', format: 'a4', orientation: 'portrait' },
        html2canvas:  { scale: 2 },
        pagebreak: { mode: ['css', 'legacy'], after: '.breakme' }
                      };
                      $('.btn').hide();

      html2pdf().from(element).set(opt).toPdf().output('datauristring').then(function (pdfAsString) {

知道为什么这在 iOS 上不起作用？

当然我也发现了这个： https://github.com/niklasvh/html2canvas/issues/1338

但这并没有解决 iOS 上的问题。

【问题讨论】：

标签： javascript html2canvas

【解决方案1】：

这一定是关于 Chrome V87 或更高版本的更新。

所以您可以尝试，将您的输入替换为 span，让我给出一些代码，除非您可以渲染所有表单：

（顺便说一句 -> 你必须为每个输入添加一个名为“数据”的类）

$("input.data").each(function(i,v) { let val = v.value; $(this).replaceWith("<span>" + val + "</span>"); });

它的工作......再次！（我希望剩下的时间！）有一些关于此错误修复的 cmets：Niklasvh/html2canvas/issues/1338

【讨论】：