如何使用html5和jquery在网页中显示pdf内容?

时间:2012-10-26 09:19:56

标签: javascript jquery html html5 pdf

如何在 div 中显示 pdf 文档。我正在使用 HTML5 jquery来构建我的移动网站。我需要在Turnjs div中显示我的pdf文档 需要翻页并转到特定页面

4 个答案:

答案 0 :(得分:26)

<div>
<object data="test.pdf" type="application/pdf" width="300" height="200">
alt : <a href="test.pdf">test.pdf</a>
</object>
</div> 

阅读此主题 - http://www.webdeveloper.com/forum/showthread.php?152923-PDF-within-a-DIV

答案 1 :(得分:10)

您可以使用此代码:

<embed src="http://domain.com/your_pdf.pdf" width="600" height="500" alt="pdf" pluginspage="http://www.adobe.com/products/acrobat/readstep2.html">

或使用Google文档嵌入式PDF查看器:

<iframe src="http://docs.google.com/gview?url=http://domain.com/your_pdf.pdf&embedded=true" 
style="width:600px; height:500px;" frameborder="0"></iframe>

答案 2 :(得分:4)

我敢说它的名字是因为害怕受到严厉惩罚,但你可以使用iframe并允许浏览器提供导航。

答案 3 :(得分:1)

我所做的是将pdf拖到谷歌硬盘。然后,点击新的pdf(它通常位于谷歌驱动器的左上角),点击顶部的共享图标,转到高级,然后点击更改并制作确保单击“公共”单选按钮。点击保存,然后点击完成。 现在返回谷歌驱动器,点击pdf打开它,然后单击弹出图标(右上角,X关闭图标旁边)。一旦pdf现在全屏,单击:更多操作图标(三个垂直点)在那里您将找到“嵌入”机会。单击它,您将获得嵌入代码。瞧!!

注意:以这种方式获得的pdf将准备好粘贴到您的博客或HTML网站中,文档中的任何链接都可以使用!!并且,在悬停时,右上方会有一个Pop-out图标,使pdf全屏显示。并且,如果您想在页面上放置多个,则可以将其弹出为 div 。有些例子是http://internetpdf.com

John Burch