一、jquery,media.js (最为推荐)

1.首先引入jquery-1.7.1.min.js和jquery.media.js两个js文件,下载保存到本地

下载地址:jquery,js&&jquery.media.js

提取码:jkfy

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

2.页面加载完成需要执行的js代码:

$(function() {
    $('a.media').media({width:'100%', height:'900px'});
});

 3.在需要预览的区域加上html代码:

<div>
    <a class="media" href="你的文件链接路径.pdf"></a>
</div>

二、通过pdfobject.js插件

1.引入pdfobject.js插件

<script type="text/javascript" src="js/pdfobject.js"></script>

下载地址:https://pan.baidu.com/s/1PsLv9icTB5CZiMM825Hcdg
提取码:jkfy

2.写js代码

<script type="text/javascript">
      window.onload = function (){
        var pdf = PDFObject.embed(
           "assets/docs/xx免责声明及数据安全保密协议.pdf",
           "#pdf"
        );
      };
</script>

三、通过pdf.js插件

下载地址:https://github.com/mozilla/pdf.js

文件很多,很麻烦 ,不推荐,有兴趣可以查看相关文章

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐