pdf在線閱讀html代碼

Ⅰ 實現在線瀏覽PDF文件的實用jQuery插件有哪些

在web開發當中我們經常需要進行需要在線瀏覽PDf內容，在線嵌入動態pdf，傳統的解決方法安裝客戶端PDF閱讀器，如果是在谷歌是可以在線瀏覽的，因為他自身就帶了一些插件，以前遇到這樣的問題往往是費時又費力，很不好解決，

今天就給大家分享一系列使用javascript實現的pdf插件效果，無需藉助第三方插件就可以實現在線瀏覽功能，非常實用。

PDFObject

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

pdf.js

和 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

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

jQuery Media Plugin

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

ZOHO Viewer

Anychart：使用JavaScript導出PDF

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

jQuery Document Viewer

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

Ⅱ 怎麼把PDF放在自己製作的html靜態頁面上

把PDF放在自己製作的html靜態頁面上，首先保證客戶端安裝有可以直接打開PDF的軟體，比如：Adobe Reader
具體解決辦法有三種，針對不同的瀏覽器兼容性方面要做稍微調整。
一、使用 <OBJECT> 標記在HTML 中嵌入PDF 文檔
如果您的用戶使用與 Internet Explorer 兼容、支持 ActiveX 控制項的瀏覽器，您可用 <OBJECT> 標記嵌入 PDF 文檔，而不需用 <EMBED> 標記。與Internet Explorer 3.0 或更高版本兼容的瀏覽器能支持 <OBJECT> 標記。
具體代碼如下：
如無法查看，請先下載安裝Adobe Reader X
<p style="margin-top: -2px; margin-bottom: 0">
<object classid="clsid:CA8A9780-280D-11CF-A24D-444553540000" id="Pdf1" width="730" height="606">
<param name="_Version" value="327680">
<param name="_ExtentX" value="19315">
<param name="_ExtentY" value="16034">
<param name="_StockProps" value="0">
<param name="SRC" value="pdf路徑">
</object>
直接嵌入PDF可能會顯示PDF頭部的功能按鈕，可以通過設置margin-top: -2px的值予以隱藏。相關參數調整嵌入的PDF的高寬。
二、使用iframe嵌入pdf
使用iframe包含pdf文件，格式上面就沒法保證，顯示出來的樣式不太好看。 具體代碼如下：
<iframe src="pdf路徑" with="" height="" scroll="no"></iframe>
三、直接打開pdf
直接打開pdf，使用連接形式打開，如果客戶端有安裝PDF閱讀軟體，可以直接打開，但是會整個顯示，全屏都是PDF內容了。
具體代碼如下：
<a href="pdf路徑">XXpdf</a>
iframe嵌入文件是最簡單的，直接載入就好.