如何使用JavaScript或jQuery将html页面导出到客户端的pdf？

And if it is not possible then what are the other alternatives?

如果不可能那么其他选择是什么?

I tried to convert a complete html page to pdf with dynamic values but I can't .

我试图将完整的html页面转换为动态值的pdf,但我不能。

But I saw some API like jspdf but it is not useful for me.

但我看到了一些像jspdf这样的API,但它对我没用。

Is it possible to save a HTML page as PDF file using JavaScript or jQuery?

是否可以使用JavaScript或jQuery将HTML页面保存为PDF文件?

In Detail:

I generated one HTML Page which contains a list grid which populated all the available reports dynamically. It has one button 'save as PDF'. If the user clicks this button then the HTML page will be converted to a PDF file.

我生成了一个HTML页面,其中包含一个列表网格,可以动态填充所有可用的报表。它有一个按钮'另存为PDF'。如果用户单击此按钮,则HTML页面将转换为PDF文件。

Is it possible using JavaScript or jquery?

是否可以使用JavaScript或jquery?

4 个解决方案

#1

jsPDF has a HTML renderer but it is in the early stages:

jsPDF有一个HTML渲染器,但它处于早期阶段:

https://github.com/mrrio/jsPDF

http://parall.ax/products/jspdf

But the best solution is the one from mujaffars. User AJAX and a stable PDF library written in PHP like FPDF, PDFLib, TCPDF and others

但最好的解决方案是来自mujaffars的解决方案。用户AJAX和用PHP编写的稳定的PDF库,如FPDF,PDFLib,TCPDF等

#2

Well, if I have got your question properly then u need to Export a Table Data as PDF?

那么,如果我有正确的问题,那么你需要将表数据导出为PDF吗?

If Yes, then please see datatables.js with simple example here.

如果是,那么请在这里看一下带有简单示例的datatables.js。

Also, look into use BytescoutPDF.js (Bytescout PDF Generator for JavaScript) to draw PDF invoice and JSPDF you can get the details here.

另外,使用BytescoutPDF.js(Bytescout PDF Generator for JavaScript)来绘制PDF发票和JSPDF,您可以在此处获取详细信息。

#3

You need to use any pdf generating library. You have not specified in which technology you are working (Php, .net or anything else)

您需要使用任何pdf生成库。您尚未指定您使用的技术(Php,.net或其他)

In PHP you can use tcpdf library, Where you can pass html to generate pdf

在PHP中,您可以使用tcpdf库,您可以在其中传递html以生成pdf

$pdf = new TCPDF(PDF_PAGE_ORIENTATION, PDF_UNIT, PDF_PAGE_FORMAT, true, 'UTF-8', false);
$pdf->AddPage();
$pdf->writeHTML($pdfHtml, true, false, true, false, '');

Where $pdfHtml will be your page html

$ pdfHtml将成为你的页面html

In your case when clicking on 'save as pdf' button you can get html by using html() method of jquery

在您点击“另存为pdf”按钮的情况下,您可以使用jquery的html()方法获取html

eg.

var pageHtml = $('html').html();

by passing pageHtml to ajax page, You can create pdf in ajax page

通过将pageHtml传递给ajax页面,您可以在ajax页面中创建pdf

#4

-7

It is possible indeed with pdf.js plugin pdf.js is an HTML5 experiment that explores building a faithful and efficient PDF renderer without native code assistance.

有可能使用pdf.js插件pdf.js是一个HTML5实验,探索构建一个忠实而有效的PDF渲染器,而无需本机代码帮助。

Online Demo

Github Link

JSFIDDLE DEMO

#1