带有PhoneGap的JQuery Mobile的外部浏览器中链接不打开

我在使用JQuery Mobile 1.2.0的PhoneGap 2.3.0中遇到问题。

任何外部链接iniOS在应用程序内打开，而不是打开他们在应用程序内部打开的Safari，使用户无法重新启动应用程序而无法返回到应用程序。

我已经试过rel =“external”和target =“_ blank”来表示它是外部链接，但没有成功。

我已经看到PhoneGap和JQMobile的默认方式应该是我想要的。 我发现了很多这种行为的要求，但不是这样。

Answer 1

我将rel="external"添加到我的锚链接中。

然后添加/覆盖MainViewController类中的shouldStartLoadWithRequest方法：

 - (BOOL) webView:(UIWebView*)theWebView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType { NSURL *url = [request URL]; // Intercept the external http requests and forward to Safari.app // Otherwise forward to the PhoneGap WebView if ([[url scheme] isEqualToString:@"http"] || [[url scheme] isEqualToString:@"https"]){ [[UIApplication sharedApplication] openURL:url]; return NO; } else { return [super webView:theWebView shouldStartLoadWithRequest:request navigationType:navigationType]; } } 

这在jQuery Mobile 1.2和Phonegap 2.2.0中适用于我。 它应该在Phonegap 2.3.0中工作 – 但我没有testing过。

================================================== ================================

更新 ：

在Phonegap 2.7.0或更高版本中可能不需要这样做。 Phonegap现在可以在UIWebView，Safari或InAppBrowser组件中打开链接。 就我个人而言，我喜欢InAppBrowser组件，因为它似乎是很多用例的更好的用户体验。 如果您想在Safari中打开链接，现在可以使用Javascript来执行此操作：

 window.open('http://whitelisted-url.com', '_system'); 

或者这个InAppBrowser：

 window.open('http://whitelisted-url.com', '_blank'); 

在这里看看更多的信息：

http://wiki.apache.org/cordova/InAppBrowser http://docs.phonegap.com/en/2.7.0/cordova_inappbrowser_inappbrowser.md.html#InAppBrowser

Answer 2

如果你不想重写类或者按照build议深入代码，试试这个。 它对我来说就像一个魅力。 我正在使用Phonegap Build和jQuery Mobile。

*注 – 我尝试了几个直接添加属性到锚标记的方法，例如<a href="http://externalsite.com target="_blank" data-rel="external" data-ajax="false">尝试target="_system – 但没有工作，所以我不得不使用JavaScript（只有5行）。

这不是太复杂，但我会带你通过它…

1. 您需要防止锚标记的默认行为。 所以不知何故，抓住你关心的标签。 我添加了一个名为“external”的类给我想打开的所有锚点标签。 相当标准的东西：

    $(document).on('click', ".external", function (e) { e.preventDefault(); }; 

2. 然后从你试图在safari中加载的锚点抓取href值。 再一次，没有什么太花哨在这里添加：

    $(document).on('click', ".external", function (e) { e.preventDefault(); var targetURL = $(this).attr("href"); }; 

3. 这是需要挖掘一点 – 我猜Phonegap改变了他们的方法与2.3？ 无论如何，在新窗口中打开抓取的href （这里是"_system"进来的地方）：

    $(document).on('click', ".external", function (e) { e.preventDefault(); var targetURL = $(this).attr("href"); window.open(targetURL, "_system"); }); 

而已。 最后一点代码就是一切。 至less这是对我有用的。

祝你好运！

（为了信贷到期，这是什么帮助我最： http : //www.midnightryder.com/launching-external-urls-in-phonegap-again-phonegap-2-4-x/ ）

Answer 3

与@KyleSimmons相同的解决scheme，但只是内联，更短。 但一个简单的修复。 而且对我很好。

 <a href="http://www.google.com/" onclick="window.open(this.href,'_system'); return false;">Google</a> 

Answer 4

在jQuery Mobile中打开一个外部链接：

 <a href="http://moorberry.net" data-rel="external">Like this</a>