【问题标题】:Download html output as an image将 html 输出下载为图像
【发布时间】:2017-07-26 05:37:30
【问题描述】:

我是前端编程的新手,我需要下载/导出 html 输出为图像或 PDF。

假设我有这个代码:

<div class="col-md-6">
    <h3>Front Side</h3>
        <div class="studentcard-frontside">
            <img src="https://dummyimage.com/100x100/000/fff" class="img-responsive"/>
            <div class="student-detail">
                <p>Student Name: <span>Bilal Zafar</span></p>
                <p>Father Name: <span>Zafarullah Khan</span></p>
                <p>Date of Birth: <span>9th March, 1991</span></p>
                <p>Address: <span>House # 12, Street # 43, Islamabad</span></p>
                <p>If Found, <span>Please call +92-333-152</span></p>
            </div>
        </div>
</div>

在这个 div 上做了一些样式后,它看起来像一张学生证,如下所示:

现在我想要的是,我需要两个按钮下载为图像和 PDF 并打印这张特定的卡片。 有什么办法可以将此html输出转换为图像和PDF?

我有谷歌,我发现 dataTables jquery,它适用于表格完美但我不知道如何在这种情况下使用它。

我们将不胜感激。

【问题讨论】:

  • 显示你首先尝试了什么以及你在什么时候卡住了。
  • @BilalZafar 你试过我下面的答案了吗???

标签: jquery html pdf datatables export


【解决方案1】:

您可能会在jQuery DataTables and ASP.NET MVC Integration 页面上查看有关jQuery Datatables 的示例用法以及所有部分(从第一部分到第六部分)。希望这会有所帮助...

【讨论】:

    【解决方案2】:

    您可以使用 html2canvas (https://html2canvas.hertzen.com/) 将 DOM 元素呈现到隐藏的画布上,然后使用:HTML5 canvas to PDF 将其导出到文件中。

    【讨论】:

      猜你喜欢
      • 2017-12-31
      • 1970-01-01
      • 1970-01-01
      • 2022-10-20
      • 2020-01-03
      • 2012-09-07
      • 2011-04-11
      • 1970-01-01
      • 2010-10-27
      相关资源
      最近更新 更多