时间戳

首页 > 解决方案 > 将 Html Css 转换为 Pdf 并下载，与设计相同

javascript - 将 Html Css 转换为 Pdf 并下载，与设计相同

问题描述

我正在尝试从 html 和 css 文件中下载 pdf，html/css 页面设计和 pdf 应该完全相同。

下面是我的javascipt！

function generatePDF2() {
    var doc = new jsPDF();

    var elementHTML = $("#contnet").html();
    var specialElementHandlers = {
      "#elementH": function(element, renderer) {
        return true;
      }
    };
    doc.fromHTML(elementHTML, 15, 15, {
      width: 170,
      elementHandlers: specialElementHandlers
    });

    // Save the PDF
    doc.save("sample-document.pdf");
  }

html

 <div id="contnet">
  <!-- HTML contnet goes here -->
  <h1>Lorem Ipsum</h1>
 Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora dolor dolorum quos quaerat consequatur doloribus mollitia distinctio eius voluptate excepturi voluptatibus nihil officia, nam animi non perferendis, unde accusantium ut.
</div>

<div id="elementH"></div>

<button onclick="generatePDF2();">Generate2</button>

不幸的是，我发现这个解决方案不起作用！

这些是我加载的标题

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/core.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

标签： javascripthtmlcss

解决方案

我认为您缺少HTML2Canvas库（js 文件）。 下载html2canvas.min.js 并将其添加为

<script type="text/javascript" src="html2canvas.min.js"></script>

推荐阅读