pdf高亮显示

现在前端pdf需求越来越多,比如发票的显示,文件的显示,怎么实现具体步骤百度一下吧,这里不做详细介绍,主要记录下遇到的问题

1.页面pdf已经看到了,但是 iframe.contentWindow.PDFViewerApplication显示undefined

当时代码是这么写的,页面已经看到pdf了,但是PDFViewerApplication确实undefined,这样findBar方法也没法用,于是我疯狂百度,搜索原因,很不幸这5个原因里面没有我的原因,不得已,值得从头来,再啃一边pdf.js,终于给我找到了

页面加载完成之后,再赋值

很开心,不仅可以高亮,还可以自动定位到高亮的位置

最后贴一下代码

			var data = res.datavar ThemeInformationFileUrlInnerhtml =`<iframe id="noticeIf" width="100%" style="border-radius: 0"></iframe>`$('#notInformationId').html(ThemeInformationFileUrlInnerhtml)$("#noticeIf").attr("src", './js/pdf/web/viewer.html?file=' + data.notTextAnnouncementFileUrl);// 检查pdf是否正确加载var intervalId = window.setInterval(function() {let iframe = document.getElementById('noticeIf');if (iframe && iframe.contentWindow && iframe.contentWindow.PDFViewerApplication) {console.log('pdf已经加载')window.clearInterval(intervalId);// PDF已加载完成,执行其他操作let text = '主要财务数据'iframe.contentWindow.postMessage(text, '*')iframe.contentWindow.addEventListener('message', (e) => {console.log('addEventListener:', e)console.log('iframe.contentWindow:', iframe.contentWindow)console.log('iframe.contentWindow.PDFViewerApplication:', iframe.contentWindow.PDFViewerApplication)iframe.contentWindow.PDFViewerApplication.findBar.findField.value = e.dataiframe.contentWindow.PDFViewerApplication.findBar.highlightAll.checked = trueiframe.contentWindow.PDFViewerApplication.findBar.dispatchEvent('highlightallchange')console.log('延迟后 iframe.contentWindow.PDFViewerApplication:', iframe.contentWindow.PDFViewerApplication)}, false)} else {console.log('pdf还没加载')}}, 1000); // 每秒检查一次

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/442441.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C++ 数论相关题目,博弈论,SG函数,集合-Nim游戏

给定 n 堆石子以及一个由 k 个不同正整数构成的数字集合 S 。 现在有两位玩家轮流操作&#xff0c;每次操作可以从任意一堆石子中拿取石子&#xff0c;每次拿取的石子数量必须包含于集合 S &#xff0c;最后无法进行操作的人视为失败。 问如果两人都采用最优策略&#xff0c;…

ArcGIS学习(二)属性表的基本操作

ArcGIS学习(二)属性表的基本操作 1.查看属性表 ArcGIS是处理空间数据的平台。对于空间数据,大家可以理解成它是由两个部分构成:1.一个是空间形体,也就是点、线、面三种。线又可以分为直线、曲线,面又分为圆形、正方形、不规则形体等;2.另外一个部分是空间形体所附带的…

Redis常见数据类型[上]

目录 前言&#xff1a; 基本全局命令 KEYS EXISTS DEL EXPIRE TTL TYPE 数据结构和内部编码 内部编码&#xff1a; 单线程架构 引出单线程模型&#xff1a; 为什么单线程还这么快&#xff1f; String字符串 字符串数据类型&#xff1a; 常见命令&#xff1a; S…

蓝桥杯---牌型种数

小明被劫持到X赌城&#xff0c;被迫与其他3人玩牌。一副扑克牌(去掉大小王牌,共52张)&#xff0c;均匀发给4个人&#xff0c;每个人13张。这时&#xff0c;小明脑子里突然冒出一个问题&#xff1a;如果不考虑花色&#xff0c;只考虑点数&#xff0c;也不考虑自己得到的牌的先后…

【Django自学】Django入门:如何使用django开发一个web项目(非常详细)

测试机器&#xff1a;windows11 x64 python版本&#xff1a;3.11 一、安装Django 安装步骤非常简单&#xff0c;使用pip安装就行 pip install django安装完成之后&#xff0c;python的 Scripts 文件夹下&#xff0c;会多一个 django-admin.exe (管理创建django项目的工具)。…

多图预警!?是时候汇总Python-R的颜色主题包了

今天这篇推文我们系统介绍下颜色主题&#xff0c;虽然之前也有介绍过一些优秀的配色网站,也有搭配好的颜色主题可以直接参考&#xff0c;但有没有直接供Python或者R绘图直接使用的关于颜色设置的第三方包呢&#xff1f;这边推文将较为详细的介绍关于Python的R的颜色主题包&…

k8s从私有库harbor中拉取镜像

一、前言 Docker镜像是构建应用程序的基础。然而&#xff0c;许多组织和开发团队希望保留他们的Docker镜像在私有仓库中&#xff0c;并从中拉取镜像&#xff0c;而不是从公共Docker Hub中下载。这样做的原因有很多&#xff0c;包括&#xff1a; 1. 安全性&#xff1a;私有仓库可…

哪种小型洗衣机好用?小型洗衣机十大排名

也许在我们的以往的印象中&#xff0c;家庭的洗衣机一般的体积都相对的大&#xff0c;而且占用的空间也比较大&#xff0c;在安装放置方面上也是非常的复杂。另外&#xff0c;对于小户型的用户而言&#xff0c;如果使用了普通的大型洗衣机&#xff0c;难免以后会出现很多不方便…

rust学习基于tokio_actor聊天服务器实战(一 )

前言 tokio是Rust中使用最广泛的异步Runtime&#xff0c;它性能高、功能丰富、便于使用&#xff0c;是使用Rust实现高并发不可不学的一个框架 Actor 背后的基本思想是产生一个独立的任务&#xff0c;该任务独立于程序的其他部分执行某些工作。 通常&#xff0c;这些参与者通过使…

EPSON RC 机器人-第一个程序

创建项目 有机械人且用USB线连接好。可以USB。没有真机的选择 C4 Sample 可以运行程序。 否刚会提示【不能连接到控制器&#xff0c;未安装USB驱动器】 代码 按F5打开运行窗口 再点【开始】 点 【是】&#xff0c;查看运行结果

2024新鲜出炉 Java集合常见面试题总结(上)

2024新鲜出炉 Java集合常见面试题总结(上) 文章目录 2024新鲜出炉 Java集合常见面试题总结(上)集合概述Java 集合概览说说 List, Set, Queue, Map 四者的区别&#xff1f;集合框架底层数据结构总结ListSetQueueMap 如何选用集合?为什么要使用集合&#xff1f; ListArrayList 和…

【CANoe使用大全】——Logging窗口

&#x1f64b;‍♂️【CANoe使用大全】系列&#x1f481;‍♂️点击跳转 文章目录 1.概述2.Logging窗口打开方式3.创建Logging4.配置4.1. 命名4.2.格式选择4.3. 路径选择与命名4.3.1.Logging文件命名_自定义4.3.2.Logging文件命名_系统内选择 5.Logging触发方式5.1 Logging模块…