如何將HTML頁面制作為可下載PDF

Question

我想做這樣的事情：會有一個表單，填寫表單並按提交后，它將進入包含所有已填充信息的頁面的預覽。 我知道如何使用JS完成所有這些操作，包括打印按鈕。 但是我想在該頁面上添加一個“下載”按鈕，以將該頁面下載為PDF。 可能嗎 ？ 如果有人可以幫助我，那將非常有幫助。

提前致謝。

Answer 1

我一直在用我的一個站點進行此操作，發現此代碼很有幫助。

https://codepen.io/AshikNesin/pen/KzgeYX

    var doc = new jsPDF();
var specialElementHandlers = {
    '#editor': function (element, renderer) {
        return true;
    }
};

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    doc.save('sample-file.pdf');
});

Answer 2

好吧，我認為這非常“簡單”。 您可以使用一些類似的庫或類：

https://parall.ax/products/jspdf

例：

從您當前的網頁中提取div：

// pick you DOM element and extract HTML as String
const html = document.querySelector("#element").innerHTML;

const pdf = new jsPDF('p', 'en', 'letter');
const handlers = {audio: () => false};
const config = {top: 80, bottom: 60, left: 40, width: 522};

pdf.fromHTML(
    html,
    config.left,
    config.top,
    {config.width, handlers},
    (dispose) => pdf.save('example.pdf'),
    config
);