Need to change @src of a parent iframe from within 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='ht开发者_如何学Gotp://bla.com;return false;'">

Basically, main site is calling my site in an iframe. I, in turn, also have an iframe on my site where I'm calling 3rd site. The third site has a frameset with a frame in it that has a link. When clicking on this link, it has to change the url of my site. My site and my child site are on the same domain. When I'm running my site as "stand-alone" (not in iframe) the above code works fine in all browsers.

Once I open my site in an 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 a console message "Access to property denied". In IE it opens up a new window with my site not in the main site anymore.

What is the correct JavaScript to change the @src attribute on my site when I'm within an iframe?

---

You are banging your head against the wall that is the same origin policy here. This is XSS country and strictly forbidden, no way around it, unless both domains agree to talk together.

You can read more about cross domain communication using iframes, but again, unless the different domain agree to talk together, you are out of luck.

Although this might seem frustrating, be glad of this rule next time you use homebanking ;)

---

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 give you your iframe element.

---

I believe that you're trying to do communication between different pages. You may take a look this API: HTML5 Cross Document Messaging

Basically, if you want to tell the parent iframe to navigate to a certain url, you can do this:

---

In the site within my site html:

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

In my site html:

// 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;
    }
}

---

You might want to have the pages communicate using AJAX. Have the site that needs to change its URL listen by long polling to to a node.js server.