编写项目遇到一个需要在浏览器中打开PDF文件的问题。最终实现效果如下:

其实也就是简单的在浏览器中实现一个打开pdf文件,并有类似预览功能的边框。

其实在网上经常见到类似的页面,在浏览器中打开pdf文档,可大部分都是由于版权的原因使用了一些很特殊的技术,自然很难模仿了。

即使有直接在浏览器打开的例子,也必须手动点击一下链接然后才能打开pdf文件。如何直接打开,而不用点击链接呢?

本以为自己对js很熟,也就使用js模拟点击,可就是不管用,没办法,只能在网上继续寻找资料。最终想不到代码却很简单。

最主要的是使用到了一个jquery的插件jquery.media.js,使用这个插件就很容易实现了。

核心代码:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta content="IE=7.0000" http-equiv="X-UA-Compatible"/>
<title>pdf阅读</title>
<script type="text/javascript" src="pdfview_files/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="pdfview_files/jquery.media.js"></script>
<script type="text/javascript">
$(function () {
$('a.media').media({ width: 800, height: 800 });
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="main"><a class="media" href="../../灾害性天气典型个例/暴雨/河套西部一次局地大暴雨成因分析.pdf" id="PDFFile">河套西部一次局地大暴雨成因分析</a>
</div>
</form>
</body>
</html>

使用jquery.media.js就可以直接把一个连接到pdf文件的链接打开,满足了需求。

[置顶] 如何在浏览器中打开PDF文件并实现预览的思路与代码的更多相关文章

  1. MVC自定定义扩展点之ActionNameSelectorAttribute+ActionFilterAttribute 在浏览器中打开pdf文档

    仅仅演示 了ASP.MVC 5 下为了在在浏览器中打开pdf文档的实现方式之一,借此理解下自定义ActionNameSelectorAttribute+ActionFilterAttribute 类的 ...

  2. 前端vue实现pdf文件的在线预览

    3.前端vue实现pdf文件的在线预览 我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 , 可以使用pdf.js这个插件 ...

  3. SharePoint 2013在浏览器中打开pdf文档

    在没有安装Office Web Apps的情况下,SharePoint 2013是支持在IE上直接打开pdf和Excel文档的(只能查看,不能编辑,部分Excel会报错). 当然,需要现在管理中心做一 ...

  4. 浏览器中打开PDF链接

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. VS Code如何在浏览器中打开Html文件?

    1.首先打开扩展 “ 文件 → 首选项 → 按键映射扩展” 快捷键:[ Ctrl+K Ctrl+M ] 2.在出现的窗口输入“open in browser”,安装 3.打开Html文件 Alt+B: ...

  6. H5拖拽 构造拖拽及缩放 pdf文件转换为html预览

    前言: 协助项目需要实现一个签名的功能. 功能说明:1.有文本签名和头像签名.2.头像签名需要实现可拖拽功能.3.需要展示的是pdf的文件并需要获取签名位于pdf文件的相对位置. 功能一:实现拖拽 思 ...

  7. vue实现pdf文件的在线预览

    我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 , 可以使用pdf.js这个插件,功能强大. <iframe :s ...

  8. 在浏览器中打开php文件时,是Linux中的哪个用户执行的?

    https://segmentfault.com/q/1010000002541340 如题,这样我就可以针对这个用户设置权限了.而且这个用户是怎么关联上的,怎么查看? 解答一: .是执行 PHP 指 ...

  9. 内卷时代下的前端技术-使用JavaScript在浏览器中生成PDF文档

    背景 在计量领域中,计量检定是一种重要形式,主要用于评定计量器具的计量性能,确定其量值是否准确一致,实现手段包括计量检验.出具检定证书和加封盖印等. 在检定证书这一环节,存在一个难点,就是无法在线预览 ...

随机推荐

  1. 最小生成树之Kruskal

    模板题,学习一下最小生成树的Kruskal算法 对于一个连通网(连通带权图,假定每条边上的权均为大于零的实数)来说,每棵树的权(即树中所有边的权值总和)也可能不同 具有权最小的生成树称为最小生成树 生 ...

  2. codeforces 510 C Fox And Names【拓扑排序】

    题意:给出n串名字,表示字典序从小到大,求符合这样的字符串排列的字典序 先挨个地遍历字符串,遇到不相同的时候,加边,记录相应的入度 然后就是bfs的过程,如果某一点没有被访问过,且入度为0,则把它加入 ...

  3. 【英语】Bingo口语笔记(54) - how to date a foreigner

  4. LOL-无双剑姬我的最爱

    LOL打了几年了,是一种娱乐的好方式,但是一个人玩不开黑就很无聊.这游戏最开始我玩的时候无论是赢是输就无所谓的,很高兴的.但是现在输了反而很气愤.也不知道为什么,所以很少玩了. 剑姬对反甲:如果对方出 ...

  5. Heritrix源码分析(九) Heritrix的二次抓取以及如何让Heritrix抓取你不想抓取的URL

    本博客属原创文章,欢迎转载!转载请务必注明出处:http://guoyunsky.iteye.com/blog/644396       本博客已迁移到本人独立博客: http://www.yun5u ...

  6. MySQL5.6 ALTER TABLE 分析和测试

    在MySQL5.5和之前版本,在运行的生产环境对大表(超过数百万纪录)执行Alter操作是一件很困难的事情.因为将重建表和锁表,影响用户者的使用.因此知道Alter操作何时结束对我们是非常重要的.甚至 ...

  7. 看人家如何拿到腾讯阿里的offer

    我是如何同时拿到阿里和腾讯offer的: https://segmentfault.com/a/1190000002627927

  8. Python中的sorted函数以及operator.itemgetter函数

    operator.itemgetter函数operator模块提供的itemgetter函数用于获取对象的哪些维的数据,参数为一些序号(即需要获取的数据在对象中的序号),下面看例子. a = [1,2 ...

  9. js处理日期的一些整理(js获取给定日期前一天的日期)

    var date = new Date(); alert(date);//获取当前时间 alert(date.getFullYear());//获取当前年分 alert(date.getMonth() ...

  10. c/c++ 编译器内存对齐问题

    C语言结构体对齐问题详解 转载自:http://blog.csdn.net/tiany524/article/details/6295551 测试环境32位机 WinXP: 编译器VC6(MS cl. ...