从大于单页的动态创建的 table (div) 创建多页 PDF

Question

我正在使用 php 和 mysql 动态创建一个 table 到包含 div 中，然后我使用 jsPDF 打印它。一切都很好，直到 table 超过一页。然后我得到的只是第一页。我花了数周、数小时阅读、尝试和测试，但无法打印出第一页。

这是我拥有的：

<!-- jsPDF Scripts -->
<script src="//mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script>
<script src="//html2canvas.hertzen.com/build/html2canvas.js"></script>

$(document).ready(function() {

        $("#pdfDiv").click(function() {

            var pdf = new jsPDF('p','pt','letter');


            pdf.addHTML($('#rentalListCan').first(), function() {
                pdf.save("rentals.pdf");
            });
        });
    });

我试过直接打印页面，但格式不成立。

我已经尝试 css 使用 @page 和 page-break-inside: auto 但它不会创建分页符。感谢您的帮助。

Answer 1

为了解决您的问题，我知道有两种方法 -

为要拆分的页面提供选项

选项={ 分页：真 };

然后 -

pdf.addHTML($('#someDiv'), marginX,  marginY, options, function() {
    pdf.save("doc.pdf");
});

请注意，这可能会严重拆分您的 table（尝试一下，您会看到）- 您可以做的一件事是在打印之前拆分的行之间添加空白 space页面为pdf。发生这种情况是因为 fromHTML() 将 table 转换为 canvas，然后根据 pdf 的页面大小拆分 canvas。

使用这样的插件 - https://github.com/Prashanth-Nelli/jsPdfTablePlugin

但是这里还不支持自定义table样式。但是您可以自定义字体和颜色。如果你table足够简单，它是一个很棒且易于使用的插件。

希望对您有所帮助！

从大于单页的动态创建的 table (div) 创建多页 PDF

Create a multi page PDF from a dynamically created table (div) that is bigger than a single page

css

php

mysql

jquery

jspdf