PhoneGap 内联 PDF答案

【问题标题】：PhoneGap Inline PDFPhoneGap 内联 PDF
【发布时间】：2013-10-30 15:30:50
【问题描述】：

我在获取 PDF 以在 PhoneGap 中内联显示时遇到一些问题。现在，我正在将 PDF 加载到一个对象中，然后尝试（但失败）将对象尺寸设置为窗口高度，以便它显示为全高（带有应用程序标题和后退按钮）。

Javascript：

<script type="text/javascript">
function jqUpdateSize(){
    var pixels = $(window).height();

    pixels = pixels - 48;

    $('#pdfViewer').height(pixels);
};
$(document).ready(jqUpdateSize)
$(window).resize(jqUpdateSize); 
</script>

HTML：

<div data-role="content" style="padding:0px; height:auto;">
    <object width="100%" height="100%" data="file.PDF"></object>
</div>

这部分工作（它在我桌面上的 Chrome/FF 中完美工作）但失败得很惨，并且在 Android 和 iOS 上都不能在应用内工作。

我看到了一些关于插件“ChildBrowser”的文档，但我不确定它会做我想做的事情或我将如何进行设置。

【问题讨论】：

由于android浏览器无法渲染pdf文件，它在android浏览器中不起作用..在ios中你可以使用iframe显示它
iFrame 不会有同样的高度问题吗？

标签： javascript css pdf cordova

【解决方案1】：

你应该尝试添加 iframe 而不是对象..

<iframe width="100%" height="100%" src="file.PDF">   
</iframe >

【讨论】：

很好，但我怎样才能让它根据设备动态调整大小？例如。这可能适用于 iPhone，但不适用于 iPad。
谢谢，但高度 % 在桌面或移动设备上都不起作用（虽然宽度是）。
你必须先将 html 和 body 设为 100% 宽 n 高

【解决方案2】：

您可以考虑使用 pdf.js 来渲染 PDF：https://github.com/mozilla/pdf.js

【讨论】：