Calling a function inside an iframe from outside the iframe [duplicate]

This question already has answers here: Invoking JavaScript code in an iframe from the parent page (17 answers) Closed 开发者_StackOverflow8 years ago.

I have a page with an iframe. Inside that iframe I have a javascript function like this:

function putme() {}

How can I call this function on the main page?

---

window.frames['frameName'].putme();

Do note that this usually only works if the iframe is referring to a page on the same domain. Browsers restrict access to pages within frames that belong to a different domain for security reasons.

---

For even more robustness:

function getIframeWindow(iframe_object) {
  var doc;

  if (iframe_object.contentWindow) {
    return iframe_object.contentWindow;
  }

  if (iframe_object.window) {
    return iframe_object.window;
  } 

  if (!doc && iframe_object.contentDocument) {
    doc = iframe_object.contentDocument;
  } 

  if (!doc && iframe_object.document) {
    doc = iframe_object.document;
  }

  if (doc && doc.defaultView) {
   return doc.defaultView;
  }

  if (doc && doc.parentWindow) {
    return doc.parentWindow;
  }

  return undefined;
}

and

...
var el = document.getElementById('targetFrame');

var frame_win = getIframeWindow(el);

if (frame_win) {
  frame_win.putme();
  ...
}
...

---

If the iframe is in a different domain than the outer page, with great difficulty, or not at all.

In general, the browser prevents javascript from accessing code from a different domain, but if you control both pages, there are some hacks to make something work. More or less.

For example, you can change the fragment of the URL of the iFrame from the outer one, poll the fragment from inside the iframe and call that function. There is a similar trick with the name of the window.

---

On the frameset, specify a name for your frame and in main page you can access the frame by its given name:

window.[FrameName].putme();

---

You can access the iframe with it's name:

foo.putme();

Functions declared globally inside the iframe page will become members of the window object for that iframe. You can access the window object of the iframe with the iframe's name.

For this to work, your iframe needs to have a name attribute:

<iframe name="foo" ...>

Also, the main page and the iframe page should be from the same domain.

---

Give the frame a name and an id - both identical. window.frameNameOrId_.functionName()

Both frames must be in the same domain (though there are ways around this to limited degree)

---

This can be done with JavaScript:

window.top.location.href = url;

Works perfectly in all major browsers.