在带有PhoneGap的JQuery Mobile中,链接无法在外部浏览器中打开

Question

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

任何外部链接iniOS都会在应用内打开,而不是打开他们在应用内打开的Safari,这使得用户无法重新启动它而无法重新启动应用.

我已经尝试了rel ="external"和target ="_ blank"来表示它是一个外部链接,但没有一个成功.

我已经看到PhoneGap与JQMobile应该采取行动的默认方式是我想要的方式.我发现了很多关于这种行为的请求,但并没有找到方法.

Answer 1

我添加rel="external"到我的锚链接.

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

- (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中工作相同 - 但我没有测试过.

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

更新:

在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

如果您不想覆盖类或根据建议深入挖掘代码,请尝试此操作.它对我来说就像一个魅力.我正在使用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. 然后href从你试图在safari中加载的锚中获取值.再说一遍,这里没有太多花哨的东西:

   $(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");
   });
   

而已.最后一点代码就是一切.至少这对我有用.

祝好运!

(在信用到期时给予信任,这是最有帮助的:http://www.midnightryder.com/launching-external-urls-in-phonegap-again-phonegap-2-4-x/)

Answer 3

与@KyleSimmons相同的解决方案,但只是内联,更短.但一个简单的修复.对我来说很棒.

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