Jquery.media.js實現網頁在線預覽pdf文件

近期在工作中遇到了需要在網站預覽pdf文件的需求,網上的資料很多,我使用了其中一種,即使用 Jquery.media.js包實現。


首先需要準備兩個內容:

1,jquery.js,任意版本

2,jquery.media.js,可以從網上搜,或者去下面我提供的地方下載(是我上傳的),鏈接如下:

http://download.csdn.net/download/u013276512/10027883


然後在頁面中引入上述的兩個js文件

<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="jquery.media.js"></script>

最後在頁面展示pdf的位置中添加一行代碼:

<a class="media" href="Thinking In Java 4(完美高清中文版).pdf"></a>  


保存頁面文件,就可以了


提示:

如果pdf文件像我例子中一樣有中文,則需要在頁面的<head>標籤中添加:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

否則會出現文件找不到的異常錯誤。


我的例子全部代碼如下:

<html>
<head>


<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Online View PDF</title>
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="jquery.media.js"></script>
<script type="text/javascript">  
$(function() {  
   $('a.media').media({width:1200, height:800});  
});  
</script>  


</head>
<body>
<div>
<a class="media" href="Thinking In Java 4(完美高清中文版).pdf"></a>  
</div>
</body>
</html>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章