open link in safari onclick within webview

is this possible to use for opening a new safari window, if a link within webview-html-content is clicked?

i tried to use

onclick="Titanium.Platform.openURL('www.url.com');"

within an <a>-tag

and failed, but maybe i'm doing something wrong here

6 Answers

Accepted Answer
Hi!
To my understanding, only the following are available in a webview:

Titanium.App.addEventListener
Titanium.App.removeEventListener
Titanium.App.fireEvent
Titanium.API.*

Therefore you cannot call Titanium.Platform.openURL('www.url.com'); directly. You'll have to bridge it over to the native side, something like this:

webview.html link attribute
```
onclick="Ti.App.fireEvent('openURL', { url: 'http://www.google.com'});"
```
app.js
```
Ti.App.addEventListener('openURL', function(e){
    Ti.Platform.openURL(e.url);
});
```
Cheers
/Jacob
— answered April 21st 2010 by Jacob Waller
permalink

8 Comments
- this seems no longer to be working on 1.7.x :(
  
  — commented July 23rd 2011 by Olivier Oswald
- i can confirm that…. why the hell!
  
  — commented August 17th 2011 by Florian Bergmann
- oh, i found out: lazy dev is lazy.
  
  you have to specify your header…
  
  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
  
  <html lang="en">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  </head>
  
  <body>
  do stuff
  </body>
  </html>
  
  — commented August 17th 2011 by Florian Bergmann
- Not working in 1.8. We are opening a webview loading an external URL and we want the links in the webview to open in the browser. We tried the suggested solution above to no avail.
  
  — commented January 27th 2012 by Joe Liu
- Works fine for me in 1.8.1. Remember to return false in the onclick or the link will still be followed i.e.
```
onclick="Ti.App.fireEvent('openURL', { url: 'http://www.google.com'}); return false;"
```
  — commented March 14th 2012 by Matthew Jones
- My group and I were never able to get this to work either in any version of the SDK, included the latest (2.0 as of this writing). We were placing the fireEvent code directly in the html, but I assume because the HTML was being fetched from a remote source that it's probably a security issue why it never works. So we ended up using a link queue and polling the page for clicks and then injecting the fireEvent into the page:
```
var win = Ti.UI.createWindow({ backgroundColor: '#fff' });

var web = Ti.UI.createWebView({
    url: 'http://www.appcelerator.com/'
});

var linkJS = 'document.titaniumLinkQueue = [];'
        + '(function(){'
            + 'var links = document.getElementsByTagName("a");'
            + 'for(var i = 0, l = links.length; i < l; i++) {'
                + 'var h = links[i].attributes["href"];'
                + 'h.value = "javascript:document.titaniumLinkQueue.push(\'" + h.value + "\');"'
            + '}'
        + '})();';

web.addEventListener('load', function() {
    web.evalJS(linkJS);
    // and 3 times a second, check to see if any links have been clicked
    setInterval(pollClickedLinks, 333);
});

function pollClickedLinks() {
    var link = web.evalJS('document.titaniumLinkQueue && document.titaniumLinkQueue.pop();');
    if (link) {
        Ti.App.fireEvent('linkClicked', { href: link });
    }
}

Ti.App.addEventListener('linkClicked', function(evt) {
    alert('You clicked: ' + evt.href);
});

win.add(web);

win.open();
```
  — commented April 30th 2012 by Beau Liddell
- Florian's post did work me as well.
  Slight modification
```
<!DOCTYPE html>
<html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head>
<body> do stuff </body> </html>
```
  — commented August 28th 2012 by Santosh Achari
- Confirmed working on iOS6, with SDK 3.1
  
  — commented April 28th 2013 by Joris
17 Votes
Any idea why it might not be working with Android? I have the following headers in a webview:
```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
</head>
```
the following link in the webview:
```
<a href="#" onclick="Ti.App.fireEvent('openURL', { url: 'http://www.google.com'}); return false;">Google</a>
```
and the following listener in the beginning of app.js:
```
Ti.App.addEventListener('openURL', function(e){
    Ti.Platform.openURL(e.url);
});
```
What I also noted, is that it's not even entering into this event listener when was trying to debug. Is this trick not available for Android?

I'm on Titanium Mobile SDK Version: 1.8.2; Titanium Studio: 1.0.9.
— answered April 7th 2012 by Artem Pervenyonok
permalink

1 Comment
- Found and answer here: that's seems to be a bug of 2.3.x simulator, should be working fine in lower versions.
  
  — commented April 7th 2012 by Artem Pervenyonok
1 Vote
I've only been able to get to a web site through creating a webview. You can create a button that will open the web view. See kitchenSink for web view examples. Here's how to get the web view going:
```
var win5 = Titanium.UI.createWindow({
    Title:'WEB VIEW',
    barColor: '#4b4b4b'
});

var webview = Titanium.UI.createWebView({
    url:'http://www.foo.com/foo.html'
});

win5.add(webview);
```
— answered April 20th 2010 by Mark Smillie
permalink

0 Comments

0 Votes
So it's not possible to do this only within webview?

— answered January 13th 2012 by Nick Robillard
permalink

0 Comments

0 Votes
Accepted Answer works fine with latest sdk

— answered April 6th 2012 by Hatem Ben Yacoub
permalink

0 Comments

0 Votes

Florian's post did work me as well. Slight modification

<!DOCTYPE html>
<html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head>
<body> do stuff </body> </html>

Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

open link in safari onclick within webview

6 Answers

Accepted Answer