This article describes the method of calling functions in the iframe framework page in Javascript. This call method is actually very simple. With this method, we can pass or modify values between iframes, and the operation is very simple. Share it for your reference. The specific implementation method is as follows:
Access the functions in the iframe:
The code copy is as follows: document.getElementById('commentIframe').contentWindow.hasLogined();
commentIframe is the id of the iframe.
To execute it in window.onload
Examples are as follows:
1.html
Copy the code as follows: <a href="#" onclick="window.frames['frame1'].MyNext()">aa</a>
<iframe id="frame1" src="2.html" ></iframe>
2.html page
Copy the code as follows:<script language="javascript" type="text/javascript">
function MyNext()
{
alert(1);
}
</script>
Clicking the test button in 1.htm can invalidate the mybutton button in 2.htm (iframe page). It's that simple, haha. If you want to call the JS function in 2.htm, write this:
Copy the code as follows: self.frames['a'].functionname(param)
Call the JS function in 2.htm in 1.htm: iframe2.showInfo();
Example description:
Suppose there are 2 pages, index.html and inner.html. There is an iframe in index.html, and the src of this iframe points to inner.html.
What we have to do now is:
1. Call a js method on inner.html in index.html
2. Call a js method on index.html in inner.html
The implementation code is as follows:
index.html:
Copy the code as follows: <html>
<head>
<script type="text/javascript">
function ff(){
alert(">> this is index's js function index.html");
}
</script>
</head>
<body>
<div style="background: lightblue;">
This is index page.
<input type="button" value="run index's function" onclick="ff();" />
<input type="button" value="run inner page's function" onclick='window.frames["childPage"].sonff();' />
</div>
<iframe id="childPage" name="childPage" src="inner.html" frameborder="0"></iframe>
</body>
</html>
inner.html:
Copy the code as follows: <html>
<head>
<script type="text/javascript">
function sonff(){
alert(">> this is inner page's js function");
}
</script>
</head>
<body>
<div style="background: lightgreen;">
This is inner page.
<input type="button" value="run index's function" onclick='parent.window.ff();' />
<input type="button" value="run inner page's function" onclick="sonff();" />
</div>
</body>
</html>
I hope that the description in this article will be helpful to everyone's web programming based on javascript.