javascript - 如何在 jspdf 中动态添加分页符,以防止表格跨两页?

标签 javascript jquery jspdf

我正在尝试创建一个网页,将数据库信息导出为 PDF,其中的表格是使用 PHP 和 MySQL 从数据库中提取的。

我的表格具有可变长度,有时可以包含多个表格,可能最多3 个以上表格

如果初始表格会占用页面上的大量空间,第二个表格会跨越后续页面,我如何告诉 jspdf 返回到上一个 <table>标签,并在其前面插入一个-分页符-? (即,如果表 2+ 的任何行将中断并移动到下一页,则将整个表移动到下一页)。

我考虑过尝试抓取并计算 <tr>标签来获取计数,并尝试设置 if-else 语句将表发送到下一页,但我不知道这对于两个以上的表如何工作。

<script>
  //this my current idea of the code, none of it is implemented or tested
  $(document).on('load', function(e) { //when the pages loads, execute this function
    var PDF_WIDTH = 816;
    var PDF_HEIGHT = (PDF_Width * 1.2941); //for a 8.5*11 Letter sized pdf
    var rowCount = 0;
    var tableCount = 0;

    $(tr).each(function(e) { //counts all the rows that exists on the page
      var rowCount++;
    });

    $(table).each(function(e) { //counts all the tables that exist on the page
      var tableCount++;
    });

    if (rowcount > 36) { //if the total number of rows would exceed the amount of rows displayed on the page
      var pdf = new jsPDF('p', 'pt' [PDF_WIDTH, PDF_HEIGHT]);
      //??? trying to select the table that would break 
      //??? add a page break before the second table
      //alternatively append a page break after the first table
    }
  });
</script>

最佳答案

你应该尝试 jspdf autotable 插件。 https://github.com/simonbengtsson/jsPDF-AutoTable 并查看多个表的示例

关于javascript - 如何在 jspdf 中动态添加分页符,以防止表格跨两页?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56366125/

相关文章:

javascript - 使用jsPDF将本地镜像打印为pdf

javascript - 打印 SSRS 报告时出错

javascript - 平滑的视差效果

javascript - 如何使用更多子选项卡扩展下拉列表?

javascript - jQuery 在 h 元素之后折叠 ul,当前元素除外

javascript - 如何在模态中打开jsPDF

javascript - 无法使用 "ng new"命令通过 ng cli 创建新项目

javascript - 包含 # 时禁用 href 链接,但启用所有其他链接

带有 iframe 的 Javascript 显示/隐藏 div 适用于除 IE 之外的所有内容

angular - 如何在 Angular 5 中使用 jsPDF 和 jspdf-autotable