Find the definition setInitialView method in static\PDF\web\viewer.js
About line 1202, different pdf.js versions are different
Add the following code at the end of the method body:
// 高亮显示关键词----------------------------------------
var keyword= new URL(decodeURIComponent(location)).searchParams.get('keyword');//获取关键词
document.getElementById("findInput").value=keyword;//对查询输入框进行赋值
document.getElementById("findHighlightAll").click();//点击高亮按钮实现高亮显示关键词
If you are not satisfied with the highlighting effect style, you can go to static\PDF\web\viewer.css
Modify as follows
--highlight-bg-color: 被搜索到的关键词背景色;
--highlight-selected-bg-color: 当前查看的被搜索到的关键词背景色;
.textLayer{
……
opacity: 0.25;//设置关键词高亮透明度
……
}
//被搜索到的关键词
.textLayer .highlight {
}
//当前查看的被搜索到的关键词
.textLayer .highlight.selected {
color: white;
background-color: var(--highlight-selected-bg-color);
}
How does pdf.js use Vue to preview PDF and support printing, without garbled characters, stretching deformation, print preview being cut and other mentally handicapped problems_Your beloved strong brother's blog-CSDN blog Download and unzip it into vue according to your usage scenario static/PDF of the project. Then start using the code above. Https://blog.csdn.net/qq_37860634/article/details/131035174 pdf.js error resolution What to do when using PDF.js to preview files always report an error Message: file origin does not match viewer's_otherError @ app.js:1140 ? ? _pdf.js error_Your beloved strong brother's blog-CSDN blog this web/app.js file. This error is really fatal! _pdf.js error
https://blog.csdn.net/qq_37860634/article/details/131035028