CODEWITHSUNDEEP
javascripthtml
Sat
Sat

Reputation: 11

How to call Javascript function from a iFrame?

I have 2 html files.

1.html will call 2.html from iframe.

<iframe src="2.html" > </iframe>

2.html defined 2 javascript functions.

function func1(a, b, c) {
  for () {
    .....
  }
}

function func2() {
 func1(a, b, c);
}

HTML

<body onload="func2()">

Now my question is, I have to merge these 2 html files to one html. 2.html must be executed inside the iframe.

I tried to do by,

<!DOCTYPE html>
<html>

  <body>
    <iframe id="foo" onload="myFunction()" /> </iframe>
    <script>
      function myFunction() {
        var iframe = document.getElementById('foo'),
          iframedoc = iframe.contentDocument || iframe.contentWindow.document;
        iframedoc.body.innerHTML = func2();
      }

    </script>
  </body>

</html>

But func2() is not called. Could anyone suggest the way to call javascript functions inside iframe?

Thanks in advance.

Upvotes: 1

Views: 85

Answers (1)

Dinca Adrian
Dinca Adrian

Reputation: 1230

You can't call functions from iframe like that, due to CSP(Content Security Policy). The only way to comunicate outside of the iframe is with message passing. See this for explanation https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage .

Upvotes: 2

Related Questions