在 Cordova 3.6 中使用 iframe 和 jquery 移动对话框弹出使用 google doc 查看器显示文档

Posted 2023-03-06

【中文标题】在 Cordova 3.6 中使用 iframe 和 jquery 移动对话框弹出使用 google doc 查看器显示文档

【英文标题】：Display documents using google doc viewer using iframe and jquery mobile dialog popup in Cordova 3.6

【发布时间】：2014-12-11 11:19:59

【问题描述】：

我正在尝试在 google doc 查看器中显示文本文档，该查看器位于 iframe 中，然后位于 jquery 移动对话框中。我正在使用 cordova 3.6 并在 ios 上尝试。

到目前为止，这是我的代码：

<div data-role="page" id="dialog">
<iframe id="myIframe" src="" style="width: 100%; height: 100%;" ></iframe>
</div>
<button href="foo.html" id="opener" data-rel="dialog" data-transition="pop">Open Dialog</button>

功能：

<script>
 $(function () 
            $("#dialog").dialog(
                autoOpen: false,
                show: "fade",
                hide: "fade",
                modal: true,
                open: function (ev, ui) 
                    $('#myIframe').src = 'http://docs.google.com/viewer?url=http://www.relacweb.org/conferencia/images/documentos/Hoteles_cerca.pdf';
                ,
                height: 'auto',
                width: 'auto',
                resizable: true
//                title: 'Vessels'
            );

            $("#opener").click(function () 
                $("#dialog").dialog("open");
                return false;
            );
</script>

使用的jquery：

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>

在浏览器上，这可以按要求工作，但在 Cordova 上则不行。 iframe 已经加载了 pdf，单击按钮没有任何反应。那么这是不可能的还是我错过了什么？

谢谢。

【问题讨论】：

要打开带有 phonegap 的 pdf，请查看 (***.com/questions/16795172/…)

@mboeckle 我在放置 qstn 之前已经看到了该线程，正如我所说，这适用于浏览器，但不适用于 cordova 应用程序，所以我不确定我错过了什么。

嗨 - 也许您使用 JS pdf 查看器 designyourway.net/drb/… 和 jquery-mobile 弹出窗口 (demos.jquerymobile.com/1.4.4/popup) 的组合

@mboeckle 嗨！截至目前，我在内部使用谷歌文档查看器和在 data-role="page" 内的 iframe，显示效果很好。但是现在查看器底部有一个“下载”链接，它在应用程序 webview 中打开实际的 pdf 本身，关于如何将它取出的任何想法？

猜你必须使用inappbrowser - ***.com/questions/17520348/…

【参考方案1】：

您可以使用here讨论过的inappbrowser插件。

最好的

M