最近在做一个土地档案管理系统 ,有个需求是在前端网页展示土地档案扫描件的pdf文件,并根据目录跳转到指定页。

第一个问题,显示pdf文件。引入pdf.js。然后设定html地址,地址为http://localhost:8080/JYSystem/static/plugins/pdfJs/web/viewer.html?file=pdf文件路径

如图

这一步网上已经有很多人实现了,并写了博客,这里我就一笔带过。

第二个问题,根据目录页码跳转到指定页。这个问题看起来挺简单,实际上还是有点麻烦(不知道是不是自己水平还有待提高),主要是网上没人写过类似的东西,无法举(生)一(搬)反(硬)三(套)。既然找不到类似资源,那就自己想办法吧。

1 观察pdf.js中显示pdf的html的页面,viewer.html,发现它有一个页面跳转的工具。只要修改参数好像就可以完成任务。

2 既然是这样,那就传参数吧。用ajax传?抱歉,我自我定位不是程序员(不是我针对程序员,而是我水平不够),不想用那么多所谓技术,我只是想用最简单合理的方式解决问题。我选择的是直接在html里把参数带进来。即http://localhost:8080/JYSystem/static/plugins/pdfJs/web/viewer.html?file=/JYSystem"+document.getElementById("savePath").value+"&page="+qsy+"就是把起始页的页码传过去。

程序截图为

3 接收参数。 在viewer.html中加入如下代码

原以为问题就这样解决了,然而并没有。在调试过程中,发现pdf页面确实跳到了指定页,但接着就又跳回了默认的第一页。

4 好吧,只能用最后一招了,修改viewew.js的源码(共7615行)。一行一行看这种低效费时愚蠢且对自己没有任何提升的方式我是很排斥的(但如果迫于无奈,我也只好强忍着干啦,能忍几次实在不好说),看了几行,放弃了,先投个机吧。我觉得出现3的问题,可能是源码在加载html页面时初始化了, 我英语还凑合(大二考六级就500多分),就查找initial吧。结果找来找去,我发现了这个函数

setInitialView: function pdfViewSetInitialView(storedHash, scale) {

this.isInitialViewSet = true;

// When opening a new file (when one is already loaded in the viewer):

// Reset 'currentPageNumber', since otherwise the page's scale will be wrong

// if 'currentPageNumber' is larger than the number of pages in the file.

document.getElementById('pageNumber').value =

this.pdfViewer.currentPageNumber = 1;

/* if (PDFHistory.initialDestination) {

this.navigateTo(PDFHistory.initialDestination);

PDFHistory.initialDestination = null;

} else if (this.initialBookmark) {

this.setHash(this.initialBookmark);

PDFHistory.push({ hash: this.initialBookmark }, !!this.initialBookmark);

this.initialBookmark = null;

} else if (storedHash) {

this.setHash(storedHash);

} else if (scale) {

this.setScale(scale, true);

this.page = 1;

}

*/

啥也不说了,把该注释的注释了。一运行,可以了。

结果如图

5 看来投机还是有效果的,然而如果有些事情投机失败了,要怎么弄呢,预支一下烦恼。

html如何跳转到pdf页面,使用PDF.js在网页显示pdf文件并跳转到指定页码相关推荐

  1. python 删除pdf页面_使用Python批量删除扫描PDF中的空白页

    对于经常看扫描PDF资料的人来说,经常会碰到如下问题: PDF缩略图 因为一些格式转换的原因,一些空白页时不时的出现,而且规律不定,一会是偶数页码一会是奇数页码,逐个选中删除的话,对于几百页的文档,非 ...

  2. java 设置pdf页面大小_通过Java实现对PDF页面的详细设置

    前言 下面的示例将介绍通过Java编程来对PDF页面进行个性化设置的方法,包括设置页面大小.页边距.纸张方向.页面旋转等.这里有如下多种页面大小尺寸可供选择: 同时,设置文档内容旋转时,可支持如下角度 ...

  3. Asp.net Core 配合 PDFObject 和 pdf.js 在浏览器显示pdf文件

    Asp.net Core 配合 PDFObject 和 pdf.js 在浏览器直接显示pdf文件 测试环境的浏览器版本: Chrome :90.0.4430.93(64 位) FireFox :88. ...

  4. 【教程】PDF组件Spire.PDF 教程:在C#中显示PDF文件的打印预览

    本文演示如何使用Spire.PDF和c#在Windows窗体应用程序中显示PDF文件的打印预览. 在使用下面的代码之前,我们需要创建一个Windows窗体应用程序,在窗体中添加一个PrintPrevi ...

  5. 当PDF页面总数不确定的时候导出PDF增加页码(i of n)

    既然是要导出PDF首先肯定是导出PDF的代码. 代码如下: 1 Document document1 = new Document();//创建一个Document 实例 2 PdfWriter.Ge ...

  6. python 删除pdf页面_使用python从新生成的pdf文件中删除空白页

    使用下面的代码,我试图将图片从目录粘贴到PDF文件中.代码已经在工作,生成我的PDF几乎如我所愿.在 唯一的问题是它总是在图片之间添加空白页,我不知道为什么. 如果我执行代码,PDF将以空白页开始,然 ...

  7. python 删除pdf页面_python 有什么库可以删除pdf 里面内容

    python 有什么库可以直接删除pdf 里面的一些元素吗?. 比如我用Py2pdf 打印后的元素是 {'/Parent': IndirectObject(1, 0), '/Contents': In ...

  8. 谷歌html弹出ie页面,HTML用JS识别浏览器,IE内核则调用谷歌打开指定链接

    index function test() { /* 创建ActiveXObject实例,只在IE下有效,才可以创建 */ if (IEVersion() != -1 ){ var objShell= ...

  9. 2022年最简单旋转PDF页面的方法推荐

    有时候,我们打开一个PDF文件就会发现,有些PDF页面会被颠倒或错误旋转,会影响我们阅读,那遇到这种情况,要如何将其旋转到正确的位置?今天我们就借助金闪PDF编辑器给大家推荐几个简单的旋转PDF页面的 ...

最新文章

  1. c语言第1章以下说法错误的是,计算机等级考试c语言程序设计习题
  2. CUDA学习笔记之 CUDA存储器模型
  3. 2019牛客暑期多校训练营(第六场)
  4. allocator_is_always_equal的实例
  5. 11gpath失败 oracle_Oracle 11gR2执行DBCA报错误
  6. mysql 数据库名称相同吗_mysql 数据库名称相同吗
  7. mysql的每隔1分钟定时_深入研究MySQL(四)、备份与恢复
  8. 上古卷轴 java_上古卷轴II-双帝传奇
  9. linux tomcat 进程杀掉_Linux下启动停止查看杀死Tomcat进程
  10. while循环基本使用方法
  11. JAVA长连接与短连接
  12. 怎么更改网络选项为家庭计算机,我的现在是公用网络我想更改为家庭网络应该如何更改...
  13. 2021年秋互联网思维期末考试
  14. 【论文速读】【金融】Predicting stock and stock price index movement using ... and machine learning techniques
  15. 多目标优化 MOP (二):遗传算法 SPEA2 2001
  16. 从钉钉后台API获取企业通讯录以后,获取每个人的钉钉运动步数
  17. 第二章 04 魔镜世界
  18. Oracle Form二次开发实战总结 调用Form
  19. 794. 有效的井字游戏
  20. 为电子书产品赋予新的定义,两款高端电子书横评

热门文章

  1. Executor框架线程池参数配置原则
  2. Python 中的 os.listdir()
  3. UWA STAR:知识的聚光生生不息
  4. AREngine深度图优化之一基于两基带统计的补洞方法
  5. 好用到爆,GitHub 星标 32.5k+的命令行软件管理神器,功能真强大
  6. 本学期C#学习个人总结
  7. 青龙面板仓库推荐 以及修复拉库失败(2.20更新)
  8. crt怎么退出编辑模式_SecureCRT-VI操作常用命令键
  9. 被尊称为“教父”的郭盛华,现在他到底在哪?
  10. iphone mac 隔空投送