yangcx666

1、使用jquery.media.js预览PDF


  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>01使用jquery.media插件进行PDF预览</title>
  6. <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
  7. <script type="text/javascript" src="js/jquery.media.js"></script>
  8. </head>
  9. <script>
  10. $(document).ready(function() {
  11. $(\'div.media\').media({
  12. width: 1200,
  13. height: 600,
  14. src: "生活规律.pdf"
  15. });
  16. });
  17. </script>
  18. <body>
  19. <div class="media"></div>
  20. </body>
  21. </html>

2、使用PDF.JS在线查看PDF


  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>02使用pdf.js插件进行PDF预览</title>
  6. </head>
  7. <body>
  8.  <a href="#" onclick="window.open(\'js/html5-online-pdf-viewer/web/viewer.html?file=/浏览器实现PDF预览/生活规律.pdf\');">
  9.   查看生活规律.pdf
  10.  </a>
  11. </body>
  12. </html>

3、利用PDF.JS插件解决了本地pdf文件在线浏览问题(根据需要隐藏下载功能,只保留打印功能)

隐藏下载功能:

在viewer.html更改即可

更改之前

 

更改之后

 

即增加   style="visibility:hidden"    就可隐藏下载功能。

隐藏打印等其他功能同上。

附件源码

下载地址:https://gitee.com/KingXin666/PDFPreviewOnBrowsers

 

分类:

技术点:

相关文章:

  • 2021-12-04
  • 2019-12-17
  • 2021-06-26
  • 2021-06-06
  • 2021-10-29
  • 2021-11-05
  • 2021-12-15
猜你喜欢
  • 2021-12-09
  • 2021-12-05
  • 2021-08-03
  • 2021-12-19
  • 2021-05-14
  • 2021-11-28
相关资源
相似解决方案