使用 Javascript 将页面导出为 PDF

Question

我正在尝试将包含许多表格的网页导出为.pdf文件。 我发现使用 javascript 触发默认打印功能可能会奏效。

该站点很长，根据加载的数据可能会更短甚至更长。

该站点看起来像这样（例如，按Strg+P时，粉红色表示可打印区域，结果在此处。）

这里的主要问题是，文本被挤压在一起（？）并被切断。

这是我正在尝试处理的代码：

javascript 本身正在触发默认的打印功能

<script>
  $("#employeePrintPage").click(function () {
    window.print();
  });
</script>

css 隐藏了我不需要的所有内容（例如徽标和导航栏），并试图让分页符起作用。

 @media print {
    #loadcontainer {
        background-color: white;
        height: 100%;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        margin: 0;
        padding: 15px;
        font-size: 14px;
        line-height: 18px;
    }

    .navbar, nav, .navbar-menu-wrapper, .navbar-nav-right, .hideprint { display: none !important; }


    table { page-break-after:always !important }
    tr    { page-break-inside:avoid !important; page-break-after:auto !important }
    td    { page-break-inside:avoid !important; page-break-after:auto !important }
    thead { display:table-header-group !important }
    tfoot { display:table-footer-group !important }

  }

我尝试使用几个 jquery 插件，但没有一个与输入字段一起使用。

我无法打开新窗口，因为输入字段不采用值。

Answer 1

你可能想检查 html2pdf js