如何在iframe中获取PDF文档加载的高度

Question

有没有办法在iframe中加载PDF内容的实际高度？

我在iPAD设备中滚动PDF内容时遇到问题？我可以获得正文内容的高度使滚动成功,但仅适用于HTML页面.

this.contentWindow.document.body.scrollHeight

但对于PDF,它没有返回PDF文档的确切高度？有没有办法达到这个目的？

谢谢

彼得

Answer 1

我在我的iPad上测试了它并且它可以工作,也许它对你也有好处.mozilla有一个HTML5 js项目,它渲染pdf文件并显示它们,你可以在pdf文件中获取页面的视口. https://mozillalabs.com/en-US/pdfjs/ https://github.com/mozilla/pdf.js/blob/master/examples/helloworld/hello.js

PDFJS.getDocument('helloworld.pdf').then(function(pdf) {
  // Using promise to fetch the page
  pdf.getPage(1).then(function(page) {
    var scale = 1.5;
    var viewport = page.getViewport(scale);

    //
    // Prepare canvas using PDF page dimensions
    //
    var canvas = document.getElementById('the-canvas');
    var context = canvas.getContext('2d');
    canvas.height = viewport.height;
    canvas.width = viewport.width;

    //
    // Render PDF page into canvas context
    //
    var renderContext = {
      canvasContext: context,
      viewport: viewport
    };
    page.render(renderContext);
  });
});

Answer 2

pdf 查看器选项是否view=fit适合您想要完成的任务（为 iframe 设置自动高度）：

<iframe src="Path/MyPDF.pdf#view=fit"></iframe>

此外，此解决方案在尝试获取高度之前将高度设置为自动（/sf/answers/830537711/）：

objIframe = document.getElementById('theIframeId');    
objIframe.style.height = 'auto';

document.body.scrollHeight

最后 - 这里的博客文章：http://dev.magnolia-cms.com/blog/2012/05/strategies-for-the-if ​​rame-on-the-ipad-problem/和iScroll4可能值得一看。