PDF.js は検索キーワードの強調表示効果を実装します

static\PDF\web\viewer.js で setInitialView メソッドの定義を見つけます。

1202行目についてはpdf.jsのバージョンが異なります

メソッド本体の最後に次のコードを追加します。

// 高亮显示关键词----------------------------------------
var keyword= new URL(decodeURIComponent(location)).searchParams.get('keyword');//获取关键词
document.getElementById("findInput").value=keyword;//对查询输入框进行赋值
document.getElementById("findHighlightAll").click();//点击高亮按钮实现高亮显示关键词

ハイライト効果のスタイルに満足できない場合は、static\PDF\web\viewer.css に移動してください。

次のように変更します 

--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);
}

pdf.js はどのようにVue を使用して PDF をプレビューし、文字化け、伸縮変形、印刷プレビューのカットなどの知的障害の問題を発生させずに印刷をサポートしますか? プロジェクトの静的/PDF。次に、上記のコードの使用を開始します。https://blog.csdn.net/qq_37860634/article/details/131035174 pdf.js エラー解決 PDF.js を使用してファイルをプレビューするときに常にエラーが報告される場合の対処方法メッセージ: ファイルの生成元が viewer's_otherError @ app と一致しません。 js:1140 ? ? _pdf.js error_あなたの最愛の強い兄弟のブログ - CSDN ブログこの web/app.js ファイル。このエラーは本当に致命的です。_pdf.js エラーhttps://blog.csdn.net/qq_37860634/article/details/131035028