为什么Phonegap应用程序中的iframe内的链接不起作用?

时间:2014-09-24 14:41:09

标签: javascript android facebook cordova iframe

我正在开发一个Phonegap应用程序。我的一个页面包含来自Facebook的iframe以显示来自facebook页面的帖子。到现在为止还挺好。在Android上,iframe中的链接不起作用。单击它们时没有任何反应。我还没有确认iOS上是否出现同样的问题。有谁知道为什么会这样或如何解决它?

澄清我想要的行为:来自facebook的iframe内的所有链接都应该在我的应用外部的外部浏览器中打开。现在,根本没有任何事情发生。

我测试的内容:我创建了一个带链接的简单html文件。我iframed那个html文件。该链接不起作用。直接放入链接(而不是通过iframe)链接可以正常工作。

很明显,但请注意:我无法更改来自facebook的iframe中的html。

2 个答案:

答案 0 :(得分:2)

我从cordova版本cli-6.0.0开始遇到同样的问题,我解决了使用“onclick”事件设置document.location.href

以编程方式将每个链接替换为iframe

这是我在cordova小部件中输入的代码:

fix_link = function()
{ 
    $("a").each(function () { 
        $(this).attr("dest_url", $(this).attr("href")) 
        $(this).removeAttr("href") 
        $(this).click(function () { 
            document.location.href = $(this).attr("dest_url");
        })
    });
}

var iframe = document.createElement('iframe');
iframe.onload = function () {
    document.framewrap.eval("fix_link_func = " + String(fix_link));
    document.framewrap.eval("fix_link_func();");
}; 
iframe.src = 'http://www.yoursite.com';
iframe.id = "framewrap";
iframe.name = "framewrap";
document.body.appendChild(iframe);

如果您找到更好的解决方案,请告诉我们!

答案 1 :(得分:1)

我仍然不确定你的实际需求是多少。但我正在使用iframe在cordova 3.5项目中加载外部页面并且它可以正确加载页面。

<iframe src="http://google.com/" frameborder="0" style="width: 100%; height: 100%;"></iframe>

我遇到了一些填充问题,jquery mobile在其页面周围放置我想是因为我加载iframe的div我删除了填充:

/*for devcontent to remove the default jquery mobile padding*/
#devContent{
     padding: 0em !important;
 }

我还要求在点击时在移动系统浏览器中打开链接,我使用SO答案来调整本机iOS代码:

- (BOOL)webView:(UIWebView *)theWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    NSURL *url = [request URL];
    NSString *str = url.absoluteString;
    NSRange range = [str rangeOfString:@"http://"];
    NSRange range1 = [str rangeOfString:@"https://"];

    if (range.location != NSNotFound || range1.location != NSNotFound) {
        [[UIApplication sharedApplication] openURL:url];
        return NO;
    }else {
        return [ super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType ];
}

当用户点击时,我还没有找到在Android系统浏览器中打开链接的解决方案。链接在应用程序内部保持开放。

让我知道这是如何解决的。 欢呼声。