使用 javascript 跳转到 PDF.js 中的页面答案

【问题标题】：Jump to page in PDF.js with javascript使用 javascript 跳转到 PDF.js 中的页面
【发布时间】：2015-06-30 16:06:28
【问题描述】：

我正在尝试使用 PDF.js 的查看器在页面上显示 pdf 文件。

我已经完成了所有工作，但我希望能够“跳转到”pdf 中的特定页面。我知道您可以使用 url 设置页面，但如果可能的话，我想在 javascript 中执行此操作。

我注意到全局范围内有一个 PDFJS 对象，似乎我应该能够访问那里的页面设置之类的东西，但它是一个相当大的对象。有人知道怎么做吗？

【问题讨论】：

标签： javascript jquery asp.net-mvc pdf pdf.js

【解决方案1】：

您可以通过 JavaScript 设置页面：

var desiredPage = [the page you want];
PDFViewerApplication.page = desiredPage;

这上面有一个事件处理器，UI会做相应的调整。您可能希望确保这没有超出范围：

function goToPage(desiredPage){
    var numPages = PDFViewerApplication.pagesCount;
    if((desiredPage > numPages) || (desiredPage < 1)){
        return;
    }
    PDFViewerApplication.page = desiredPage;
}

【讨论】：

我如何访问/初始化 PDFViewerApplication ？
它是pdf.js中的一个变量。看起来他们正在编写文档，但您可以查看代码：mozilla.github.io/pdf.js/web/viewer.js
当用户导航到另一个页面时，是否有任何事件可用于获取通知。

【解决方案2】：

如果 Pdf 显示在 iframe 中并且您想导航到页面，则使用以下代码。 'docIfram' 是 iframe 标记 ID。

document.getElementById("docIframe").contentWindow.PDFViewerApplication.page=2

【讨论】：

【解决方案3】：

在我的情况下，我在 iframe 中加载 pdf 文件，所以我不得不以其他方式进行。

function goToPage(desiredPage){
var frame_1 = window.frames["iframe-name"];
var frameObject = document.getElementById("iframe-id").contentWindow;
frameObject.PDFViewerApplication.page = desired page;
}

【讨论】：