You must change the @src of the parent iframe from within the child iframe

I have the following HTML markup (don't ask ....)

- document //main site - <iframe> //my site - <iframe> //site within my site - <frame> - <a onclick="JavaScript:parent.parent.location.href='http://bla.com;return false;'"> 

Basically, the main site calls my site in an iframe. I, in turn, also have an iframe on my site, where I call the third site. The third site has a set of frames with a frame in which there is a link. When clicking on this link, he should change the URL of my site. My site and my sub site are in the same domain. When I launch my site as "standalone" (not in an iframe), the above code works fine in all browsers. As soon as I open my site in the iframe of the main site, it looks like the above code is trying to change the source of the main site. In FireFox I get the console message "Access to property denied". In IE (lol), it opens a new window with my site not on the main site.

What is the correct JavaScript to change the @src attribute on my site when I am in an iframe?

Hope this is not too embarrassing. Thanks!

+4
source share
4 answers

You knock your head against the wall, which is the same origin policy here. This is an XSS country and is strictly prohibited, it will not cost in any way if both domains agree to speak together.

You can learn more about cross-domain communication using iframes , but then again, if the other area does not agree to speak together, you're out of luck.

Although this may seem disappointing, be happy with this rule the next time you use homebanking;)

+2
source

Can you try something like this

 <document> //main site <iframe id="my_iframe"> //your site <iframe> //site within your site <frame> <a onclick="JavaScript:Top.document.getElementById('my_iframe').location.href='http://bla.com;return false;'"> 

Top refers to the main window, and then getElementById ('my_iframe') will provide you with your iframe element.

+2
source

I believe that you are trying to establish a link between different pages. You can take a look at this API: HTML5 Cross Document Transfer

Basically, if you want to tell the parent iframe to go to a specific URL, you can do this:


On site in my html site:

 // onclick of your anchor, post message (an event) with an expected origin window.postMessage("http://bla.com", "www.sitewithinmysite.com"); 

On my html site:

 // listen to the event "message" window.addEventListener("message", messageHandler, true); function messageHandler(e) { // only recognize message from this origin if (e.origin === "www.sitewithinmysite.com") { // then you can navigate your page with the link passed in window.location = e.data; } } 
0
source

You might want pages to communicate using AJAX. Have a site that needs to change its URL while listening to a lengthy survey, to the node.js server.

0
source

All Articles