摘要：在web開發時我們有時會需要在線預覽PDF內容，在線嵌入pdf文件；

問題1：如何網頁中嵌入PDF：

在網頁中：

常用的幾種PDF預覽代碼片段如下：

代碼片段1:

1  <object type="application/pdf" data="file:///D:/atm/prtPDF/2016-07-28622262104000373211200009087.pdf"
           id="review" style="width:800px;  height:750px; margin-top:45px;  margin-left:500px" >
2  </object>

代碼片段2：

1  <object type="application/pdf" data="D:/atm/prtPDF/2016-07-28622262104000373211200009087.pdf"
           id="review" style="width:800px;  height:750px; margin-top:45px;  margin-left:500px" >
2  </object>

代碼片段3：

1 <embed src="file:///D:/atm/prtPDF/2016-07-28622262104000373211200009087.pdf"
         id="review" style="width:800px;  height:750px; margin-top:45px;margin-left:500px" >
2 </embed>

常用到的方法有以下幾種：

PDFObject

8個實現在線瀏覽PDF文件的實用jQuery插件

PDFobject可以幫助你在頁面直接嵌入pdf文件，有時候有些項目需要動態地嵌入PDF文件。PDFObject為此而設計的，他能夠快速和容易的嵌入PDF文件，PDFObject使用JavaScript來產生相同的符合標准的 標記，然后插入 到您的HTML元素的選擇。您可以填滿整個瀏覽器窗口，或將PDF格式轉換成一個

或其他塊級元素。

pdf.js

8個實現在線瀏覽PDF文件的實用jQuery插件

和 Google Chrome 使用的源自 Foxit 的閉源 PDF 瀏覽插件不同，PDF.js 是基於開放的 HTML5 及 JavaScript 技術實現的開源產品。

pdf.js 是一個主要用於HTML5 平台上在線閱讀PDF文檔的小插件，基於JavaScript技術編寫而成，無需任何本地技術支持。

pdf.js是由Mozilla Labs發布的。他們的目標是創建一個通用的，基於標准的網絡平台，能夠解析和渲染PDF文件，並最終發布一個PDF閱讀器擴展，毫無疑問 pdf.js 將被整合入 Gecko 成為 Firefox 的內嵌 PDF 閱讀器，但是具體整合時間表尚未確定

jsPDF

8個實現在線瀏覽PDF文件的實用jQuery插件

jsPDF 是一個使用Javascript語言生成PDF的開源庫。你可以在Firefox插件，服務端腳本或是瀏覽器腳本中使用它。客戶端Safari 和 iPhone Safari 支持得最好,其次是Opera和Windows下的Firefox 3等。IE暫不支持。。

jQuery Media Plugin

8個實現在線瀏覽PDF文件的實用jQuery插件

jQuery Media Plugin是一款基於jQuery的網頁媒體播放器插件，它支持大部分的網絡多媒體播放器和多媒體格式，比如：Flash, Windows Media Player, Real Player, Quicktime, MP3,Silverlight, PDF。它根據當前的腳本配置，自動將a標簽替換成div，並生成object, embed甚至是iframe代碼，至於生成object還是embed，jQuery Media會根據當前平台自動判別，因此兼容性方面非常出色下面這段代碼是jQuery Media生成后的。

 

Google Docs PDF viewer

8個實現在線瀏覽PDF文件的實用jQuery插件

ZOHO Viewer

8個實現在線瀏覽PDF文件的實用jQuery插件

Anychart：使用JavaScript導出PDF

8個實現在線瀏覽PDF文件的實用jQuery插件

下圖可以導出為PNG或JPG格式的靜態圖像或嵌入式靜態圖像，圖表或一個完全互動的功能圖

 

jQuery Document Viewer

8個實現在線瀏覽PDF文件的實用jQuery插件

Document Viewer是一個jQuery插件，可以讓你在網頁中直接查看多種文件格式。文檔瀏覽器支持的文件格式：PDF文件，文本文件，代碼，圖像，音頻，視頻等。

來自：http://www.cnblogs.com/58top/archive/2012/11/26/a-list-of-jquery-pdf-viewers-available-at-the-moment.html

 

問題2:在I頁面中無法顯示嵌入的PDF文件時使用代碼片段1、並在瀏覽器中輸入chrome://plugins;如下圖所示；

如果你加載本地路徑的PDF文件時；瀏覽器會提示無法加載本地資源文件時；原因分析以及解決方案如下：

由於Chrome的安全限制問題；瀏覽器一般不允許加載本地資源文件；

 

 

0
0
« 上一篇： JS利用正則配合replace（）函數替換指定字符
» 下一篇： 如何獲取xml循環體報文內容 
	</div>
	<div class="itemdesc">
		發表於 <span id="post-date">2016-11-30 20:01</span> <a href="http://www.cnblogs.com/xgyy/">喜個陽陽~</a> 閱讀(<span id="post_view_count">9915</span>) 評論(<span id="post_comment_count">0</span>)  <a href="https://i.cnblogs.com/EditPosts.aspx?postid=6119459" rel="nofollow">編輯</a> <a href="#" onclick="AddToWz(6119459);return false;">收藏</a>
	</div>
</div>
<div class="seperator">&nbsp;</div>
<script type="text/javascript">var allowComments=true,cb_blogId=319536,cb_entryId=6119459,cb_blogApp=currentBlogApp,cb_blogUserGuid='39c2782e-e9b5-e611-845c-ac853d9f53ac',cb_entryCreatedDate='2016/11/30 20:01:00';loadViewCount(cb_entryId);var cb_postType=1;</script>