jquery中pdf在页面的显示和导出
- [01 显示pdf](#01 显示pdf)
-
- [01 .pdf结尾在线接口显示到页面 （pdf.js库怎么安装及使用）：只显示一页](#01 .pdf结尾在线接口显示到页面 （pdf.js库怎么安装及使用）：只显示一页)
- [02 如何用PDF.JS显示整个PDF (而不仅仅是一页)？](#02 如何用PDF.JS显示整个PDF (而不仅仅是一页)？)
- [03 jQuery实现在线预览PDF文件(通过a标签链接跳转)：](#03 jQuery实现在线预览PDF文件(通过a标签链接跳转)：)
- [02 导出pdf](#02 导出pdf)
想要实现弹窗中显示pdf内容，并导出pdf.
01 显示pdf
第一，二个是通过pdf.js实现pdf在页面的显示，只不多第一个只显示一页，第二个可显示全部；第三个是通过jquery.media.js实现pdf在页面的显示
重点讲第二个！！
01 .pdf结尾在线接口显示到页面 （pdf.js库怎么安装及使用）：只显示一页
参考：https://www.yisu.com/ask/45769732.html
这个只显示第一页，想要显示全部页面，需要循环加载
02 如何用PDF.JS显示整个PDF (而不仅仅是一页)？
PDFJS有一个成员变量numPages，所以你只需要遍历它们。
但是重要的是要记住，在pdf.js中获取页面是异步的，因此顺序将得不到保证。所以你需要用链子锁住它们。你可以这样做：
javascript
var currPage = 1; //Pages are 1-based not 0-based
var numPages = 0;
var thePDF = null;
//This is where you start
PDFJS.getDocument(url).then(function(pdf) {
//Set PDFJS global object (so we can easily access in our page functions
thePDF = pdf;
//How many pages it has
numPages = pdf.numPages;
//Start with first page
pdf.getPage( 1 ).then( handlePages );
});
function handlePages(page)
{
//This gives us the page's dimensions at full scale
var viewport = page.getViewport( 1 );
//We'll create a canvas for each page to draw it on
var canvas = document.createElement( "canvas" );
canvas.style.display = "block";
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
//Draw it on the canvas
page.render({canvasContext: context, viewport: viewport});
//Add it to the web page
document.body.appendChild( canvas );
//Move to next page
currPage++;
if ( thePDF !== null && currPage <= numPages )
{
thePDF.getPage( currPage ).then( handlePages );
}
}参考：https://cloud.tencent.com/developer/ask/sof/251356
03 jQuery实现在线预览PDF文件(通过a标签链接跳转)：
参考：
https://blog.csdn.net/angellee1988/article/details/121644256
02 导出pdf
参考：
jquery页面:
https://blog.csdn.net/hnn567/article/details/132356614
微信小程序：