javascript - Launch mobile safari from full screen web app on iPhone - Stack Overflow

admin管理员组

文章数量:1336625

I've Googled this question in a few variations and can only find answers in the context of using PhoneGap or jQuery mobile. However, I'm using neither... just plain old html and javascript.

I'm trying to launch mobile safari from a full screen web app using window.open()... not an inline anchor. No matter what I do, the url opens in the web app, not in Safari. Does anyone have any suggestions?

Thanks.

I've Googled this question in a few variations and can only find answers in the context of using PhoneGap or jQuery mobile. However, I'm using neither... just plain old html and javascript.

I'm trying to launch mobile safari from a full screen web app using window.open()... not an inline anchor. No matter what I do, the url opens in the web app, not in Safari. Does anyone have any suggestions?

Thanks.

• javascript
• iphone
• iphone-standalone-web-app

Share Improve this question Follow edited Jun 20, 2012 at 21:22 ThinkingStiff 65.4k3030 gold badges147147 silver badges241241 bronze badges asked Mar 24, 2011 at 17:51 VinceVince 58999 silver badges1616 bronze badges

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 2

It took me a while but I was able to piece this solution together. In an iOS standalone web app mode, it creates a link element using jQuery, adds it to the body, simulates a click on it, and then removes the link. You can acplish the same thing without jQuery, it just takes more code using the naive DOM methods.

if (window.navigator.standalone) {
  var $a = $('<a href="' + url + '" target="_blank"/>');
  $("body").append($a);

  var a = $a.get(0);

  var mouseEvent = a.ownerDocument.createEvent('MouseEvents');
  mouseEvent.initMouseEvent('click');
  a.dispatchEvent(mouseEvent);

  $a.remove();
}
else {
  window.open(url, '_blank');
}

As of iOS 4.3, the only way I know of is to convert the <div> into an <a target="_blank"> and let the default browser to handler it. It launches the new page into an external Safari.

In PhoneGap, all URLs load into WebView by default. Setting targets or being fancy with JS will not break your external links out of that WebView. In order to load external URLs into Safari, rather than the PhoneGap app itself, you need to modify the way URLs are handled in the application delegate.

Open up your PhoneGap app code and locate [projectname]AppDelegate.m ... typically found under [projectname]/Classes folder.

Modify shouldStartLoadWithRequest however you like. Here is a sample implementation that will evaluate requests and handle HTTP or HTTPS schemes to load in Safari (borrowed from http://solutions.michaelbrooks.ca/2011/02/15/open-external-links-in-safariapp/):

- (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 ];
    }
}

Have you tried using window.openNative()?

can't you use a normal A HREF Tag? this normally opens Safari from within a webapp.

If you cannot create a standard HTML link , but you must open Safari programmatically (with Javascript code only), here is the code:

var a = document.createElement("a");
a.setAttribute('href', facebook);
a.setAttribute('target', '_blank');
a.click();

本文标签： javascriptLaunch mobile safari from full screen web app on iPhoneStack Overflow