Geek asks and answers

HTML5 phonegap webapp opens links in safari or other native application

I have a working, accepted and approved apple, html5 phonegap webapp, but I can’t get external links to open safari or map applications. The problem in the Android version is the same.

It happens that when I click / tap the link, I assume the inappbrowser phone delay captures the window.open event and loads the external page into the current instance of the window and there is no return key.

Now the application will simply show the external loaded page until it exits and reloads.

I read a huge amount of comments and forums about this. I followed all the options that I could find, but the problem remains.

Can someone please tell me where I am wrong because I am losing hair at an alarming rate ...

Build is online with Phonegap 3.1 using phonegap.js and jquery. I grab the external link through jQuery, it all works.

Below is the code I'm using.

// capture external link click or tap?
$(document).on('click', 'a[data-rel="external"]', function(e){
e.preventDefault();
var targetURL = $(this).attr("href");
console.log('external link: '+targetURL);
var ref = window.open(targetURL, '_system', 'location=yes');
});

I read the telephone documentation about the config.xml file on the phonegap page , and this is what I added to it.

<preference name="phonegap-version" value="3.1.0" />
<plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser" />
<plugin name="InAppBrowser" value="CDVInAppBrowser" />

I also read about the name of the Apple url and use this in the config.xml file:

<gap:url-scheme name="com.canal-st.canal-st" role="None">
<scheme>mailto</scheme>
<scheme>tel</scheme>
<scheme>http</scheme>
</gap:url-scheme>

I must have missed something. Finally, I call mobileinit bind is called before jquery.mobile:

<script src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).bind("mobileinit", function(){
   $.support.cors = true;
   $.mobile.allowCrossDomainPages = true;
   $.mobile.pushState = false;
   console.log('in mobileinit');
});
</script>
<script src="js/jquery.mobile-1.3.1.min.js"></script>

I know there are many such questions here, but none of the solutions work, or is this a new version of the telephone problem causing the problem?

+3
source share
1 answer

Your window.open should use '_self' instead of the system. Example:

$(document).on('click', 'a[data-rel="external"]', function(e){
    e.preventDefault();
    ....
    var ref = window.open(targetURL, '_self', 'location=yes');
});
0

More articles:


All Articles