打开嵌入在 div 中的 pdf答案

【问题标题】：Open pdf embedded in a div打开嵌入在 div 中的 pdf
【发布时间】：2016-10-14 07:37:59
【问题描述】：

我有一个网页显示我之前上传的一些 pdf，但我希望当我点击他们的链接时，将其打开到一个命名的 div 中。

我的代码：

<div class='row'>
  <div class='col'>
    <a href='pdf1.pdf'>pdf1</a>
    <br/>
    <a href='pdf2.pdf'>pdf2</a>
  </div>
  <div class='col' id='preview'>OPEN PDF PREVIEW</div>
</div>

如果我点击“pdf1”或“pdf2”，我的两个文件可能会打开到 id 为 PREVIEW 的 div 中

我尝试了一些 jquery 函数，但没有运气。

【问题讨论】：

你在用jquery吗？为id='preview' ？请分享

标签： javascript php jquery html pdf

【解决方案1】：

你可以这样做：

<iframe src="http://docs.google.com/gview?url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>

您只需将您的 pdf 路径传递给 url

【讨论】：

用你的解决方案它可以工作，但我需要一些小东西让它变得更好。
1) 高度和宽度固定后，我的页面因 iframe 而被拉伸。当我点击它的链接时，有一种方法可以使 iframe “不可见”并在他的尺寸中展开？ 2）我想使用jquery“toggle”让它在我第二次点击时消失。有可能吗？
好的，如果它对你有用，那么你可以投票，也可以接受这个作为答案

【解决方案2】：

如果您想在 iframe 中打开链接，请尝试使用 target="iframeName"，如 W3C 所示。

【讨论】：

结合 Insomania 的回答，试试下面的方法：a href="docs.google.com/gview?url=http://example.com/…" target="preview" 你有一个名为“preview”的iframe