Make links inside an iframe open in a new window

Question

I'm trying to display an map inside an iframe that has a needle which on mouseover shows some information about a certain company, the thing is once you click the link the page opens up inside the iframe which ruins the experience, so i was wondering is it possible to make the links inside an iframe open up in a new window instead perhaps using jquery or something similiar?

the code i have atm is

http://www.jsfiddle.net/rkd59/1/

Edit: the very least capture a click within the iframe so i might resize the iframe

Answer 1

You will need some kind of open API to do this properly, and Eniro doesn't provide one according to this page (in Swedish).

I would recommend you to use the Google Maps API v3 instead. I've made an example on jsFiddle that looks similar to that of Eniro.

I'll gladly give you more help with this, so just ask away!

Answer 2

To make a link popup in a new window you would usually use target="_blank" as such:

<a href="http://www.yahoo.com" target="_blank">Go to Yahoo</a>

However this will only work if you can modify the code you're showing within the iFrame

Answer 3

Please try the following:

<script>
x=document.querySelectorAll("a");
for(i=0;i<x.length;i++)
{
   x[i].setAttribute("target","_blank");
}
</script>

Thus all links open in new frame.

Answer 4

由于此映射是在iFrame中加载的，因此无法在链接上运行任何javascript事件侦听器，也无法更改html。

Answer 5

You can't (or it is extremely hard to ) make events inside the iframe affect the parent page. This is to prevent attacks from XSS, or cross site scripting . Having said that, if the site within the iframe is on your own domain and you want to set up some extremely tricky ajaxing and php session IDs, maybe you could make something work, but even then I'm not sure. And I don't know if this would be a security hole, maybe someone else can speak to that. It would perhaps look like:

1. main page sets up session ID and passes that to the iframe url via a get variable
2. the iframe takes click information and sends it to a Session variable via an ajaxing call to a script on the server.
3. The main page then reads (how?) the session cookie and makes changes based on it's value.

All in all, you may find that it may be much simpler and more secure to acheive what you want using a different method.

Answer 6

There is a partial solution .

You can add an absolutely positioned DIV tag over the top of the IFRAME and capture clicks on this instead. See example here shaded in 20% alpha red.

http://www.jsfiddle.net/rkd59/6/

However, this means that the map works in "read-only mode" and while you can capture the click event you wont know what link the user has clicked on.