重复打开 PDF 并跳转到指定页面(即使滚动过)。

3

我一周前曾经问过类似的问题,但可能我没有把问题表述清楚。

此后我一直在努力寻找解决方案,但没有成功。

我想在最新版本的所有常见浏览器中打开一个PDF文件,并显示在特定页面。


使用Chrome - 可以做到 :-)

按下按钮会在第3页打开PDF文件。 如果用户将PDF滚动到其他页面,然后重新按下按钮,PDF将再次在第3页打开;

使用FF、IE或Safari

按下按钮会在第3页打开PDF文件。 如果用户将PDF滚动到其他页面,然后重新按下按钮,什么也不会发生。


有人知道如何在所有最新的浏览器上始终打开第3页吗? 如果必要,我完全可以改变我的方法,包括使用免费插件。

如果有人知道我正在尝试做的事情只能在Chrome中完成,那么如果他们能让我知道就好了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Test for SO</title>
  <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
</head>

<body>
  <input id="test" value="Test" type="button" />
    <br />
  <iframe id="iFrame" width="500" height="600"></iframe>
</body>

</html>

<script type="text/javascript">
  $(function () {
    $("#test").click(function () {
      var fileName = "/PDFFiles/pages.pdf#page=3";
      $('#iFrame').attr("src", fileName);
    });
  });
</script>

也许你可以在你的另一个问题中提供一个参考。或者你可以编辑你的其他问题,使其更加清晰明了? - Bernhard
你是在说人们会注意到我编辑了我的问题吗?我不知道,以后会注意的。感谢您提供的信息。根据我的过去经验,有时人们会以猜测或类似于“你为什么想做那件事”的无用回答来回应,然后其他人就不再回复了。您能帮我解决我的问题吗? - Pete Davies
我认为只有 Adobe PDF 插件支持页面参数。 <code><a href="http://www.example.com/sample_doc.pdf?page=3">sample_doc.pdf 的第 3 页</a></code> 您还可以<a href="http://www.gnostice.com/nl_article.asp?id=217&t=Trouble-free_Linking_To_PDF_Pages_Online">添加 PDF 操作以便打开特定页面的文档</a>。 我已经展示了如何使用我们的产品 PDFOne .NET 来实现此操作,但您也可以使用任何其他工具来添加 PDF 操作。 - BZ1
@PeteDavies 请选出最佳答案。 - Adam Friedman
4个回答

3

这适用于Chrome浏览器

<A HREF="http://www.example.com/myfile.pdf#page=4">

为了让这在所有浏览器中都能运行,PDF 必须编码为打开到特定页面。这可以使用 Adobe Acrobat 完成。

1

请尝试使用谷歌文档查看器,具体步骤如下:

<iframe src="http://docs.google.com/gview?url=http://infolab.stanford.edu/pub/papers/google.pdf&embedded=true" style="width:100%; height:500px;" onload="javascript:this.contentWindow.location.hash='#:0.page.4';" frameborder="0"></iframe>

关键部分是 onload 函数,它添加了从零开始的索引页码以进行显示:

onload="javascript:this.contentWindow.location.hash='#:0.page.4';"

如果您需要一个按钮来重新加载iframe,只需更新iframe的src(我认为这是最简单的方法,但我可能错了):
$('button').click(function(){
  $('iframe').attr("src", function() { 
    return this.src;
  });
});

非常感谢你的建议,fudgey。我很欣赏它。可能需要一些时间来设置,所以我明天会在工作中完成它。我显然会报告我的进展情况,但我相信肯定会有一些阻止它正常工作的问题 :-) - Pete Davies
我尝试了你的建议,但它没有起作用。如果你想试一下,这段代码应该打开一个PDF文件。<iframe onload="javascript:this.contentWindow.location.hash=':0.page.3';" src="https://docs.google.com/open?id=0B0BWfYHJlhNrTEU3bnB5QnVRZzJIWkJOaDd3VG5udw&embedded=true" style="width: 100%; height: 500px"></iframe> - Pete Davies
嗯,实际上它在非Chrome浏览器中可以工作。似乎Chrome会给出错误提示“Unsafe JavaScript attempt to access frame with URL”... - Mottie

0

我的建议是将iframe的src先设置为其他值,然后再切换回正确的文档。仅限短时间。


谢谢Martin。我刚刚尝试了你的建议,但恐怕它没有起作用。我相信这个问题不是简单的,但一定有答案存在。 - Pete Davies
Martin:你必须销毁并重新创建整个iframe DOM节点。请参考我的答案:https://dev59.com/Fm_ds4cB2Jgan1zn3psA#10791643 - Adam Friedman

0
您需要销毁并重新创建 iframe 节点本身。例如:
<input id="test" value="Test" type="button" />

<br />

<div id="wrapper"> 
 <!-- iframe will be continually destroyed and re-created here --> 
</div>


<script type="text/javascript">
    // Create the initial iframe on page load
    $('<iframe id="iFrame" width="500" height="600" src="/PDFFiles/pages.pdf">').appendTo('#wrapper');

    // Destroy and recreate iframe on button click, starting on your desired page.

    $("#test").click(function () {

     if($('#iFrame').length) { 
       $('#iFrame').remove(); 
     }

     var page = 3;
     $('<iframe id="iFrame" width="500" height="600" src="/PDFFiles/pages.pdf#page='+page+'">').appendTo('#wrapper');

    });

</script>​​​​​​​

注意:PDF 文件会在加载时再次回到第一页,但您可以将其隐藏在 Ajax 加载器球下 1-2 秒钟,然后在您使其可见时,它将跳转到您想要的页面。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接