从外部html文件和css生成pdf

问题描述 投票：0回答：1

我有一个外部html文件，我想将其打印为PDF，但是在使示例代码按预期工作时遇到了麻烦，在实现它时，我显然缺少了一些琐碎的东西。

到目前为止，这是我的代码：

function savePDF(data) {
    var parser = new DOMParser();
    var htmlDoc = parser.parseFromString(data, 'text/html'); 

    let pdf = new jsPDF('p','pt','a4');
    pdf.addHTML(
        htmlDoc.body, // HTML DOM element.
    );
    pdf.save("test.pdf");
}

[data是一个包含要转换为pdf的外部网页的html的字符串。

Chrome正在生成TypeError：Cannot read property 'innerWidth' of null

例如，这很好用（使用fromHTML而不是addHTML），但缺少CSS /样式：

function savePDF(data) {    
    var parser = new DOMParser();
    var htmlDoc = parser.parseFromString(data, 'text/html'); 

    let pdf = new jsPDF('p','pt','a4');
    pdf.fromHTML(htmlDoc.body.innerHTML, 0, 0, {},
        function(){pdf.save('test.pdf');
    });
}

我正在使用的示例HTML：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>PDF Test</title>
    </head>
    <body>
        <div id="capture" style="padding: 10px; background: #f5da55">
                <h4 style="color: #000; ">Hello world!</h4>
        </div>
    </body>
</html>
javascript jspdf html2canvas
1个回答
0
投票
正如文档所述，不建议使用addHtml方法（http://raw.githack.com/MrRio/jsPDF/master/docs/global.html#addHTML），所以我在您的示例中玩了一点，如果您像这样更新代码，它就可以工作。您仍然需要做一些工作以固定pdf中div的宽度。
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.