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>


猜你喜欢

转载自blog.csdn.net/u013276512/article/details/78272907