Skip to content Skip to sidebar Skip to footer

Opening Links In External Device Browser With Cordova/jquery-mobile

I have a bunch of links in my app. I added rel='external' target='_blank' to all of them. In the Ripple emulator, or in a regular desktop browser, this works great. But on my Andr

Solution 1:

This has been really fickle with Cordova/PhoneGap in the last few releases, I believe because of the InAppBrowser work which might be a solution for you.

What is working for us to launch in the external browser is:

window.open("http://myurl.com", '_system');

In our case, we want to find all external links and launch them in Safari/Chrome (and keep internal links in our Angular router). This probably isn't the most elegant solution, but we are doing this right now by capturing input events on the links and taking over the behavior like so:

        $(document).on('mousedown','a', function(e) {
            e.preventDefault();
            var elem = $(this);
            var url = elem.attr('href');
            if (url.indexOf('http://') !== -1) {
                window.open(url, '_system');
            }
        });

I hope that helps you a bit.

Solution 2:

I had issues with Jason Farnsworth's answer still firing the default action after the user returned to the app in iOS. So after a little tweaking of his code I arrived at the following and it behaved as expected.

$(document).on('click', 'a', function (e) {
   var elem = $(this);
   var url = elem.attr('href');
   if (url.indexOf('http://') !== -1) {
       e.preventDefault();
       window.open(url, '_system');
       returnfalse;
   }
});

Solution 3:

There're a few questions like this, but all of them try to use inappbrowser. I've used the following plugin:

com.byhook.cordova.chromelauncher

Just install it, as always, through cli:

cordova plugin add com.byhook.cordova.chromelauncher

And add the following JavaScript code:

ChromeLauncher.open(url)

This will:

  1. put your app in background mode
  2. open the existing instance of "google chrome for android" browser (according to the code, Google Play is gonna be opened if Chrome browser is not found, but i haven't tested this)
  3. add a new tab to Chrome browser pointing to the desired URL

Solution 4:

You Could just remove target attribute

Use only "rel" attribute

I hope it could solve your problem as i face that problem multiple times.

Post a Comment for "Opening Links In External Device Browser With Cordova/jquery-mobile"