iframe子页面js调用父页面js函数/父页面调用Iframe子页面中js方法
浏览数：41 /
时间：2015年06月09日
1、假设当前页面为a.html, iframe的src页面为b.html,其代码如下：
1 <span class="tag"><html> 2 <br></span><span class="tag"><head> 3 <br></span><span class="tag"><title></span><span class="tag"></title></span><span class="tag"> 4 <br></head> 5 <br></span><span class="tag"><body></span><span class="tag"> 6 <br> <p></span><span class="pln">iframe页面里的js调用父级页面js函数的demo</span><span class="tag"></p> 7 <br></span><span class="tag"> <iframe</span><span class="atn">frameborder</span><span class="pun">=</span><span class="atv">"0"</span><span class="atn">width</span><span class="pun">=</span><span class="atv">"0"</span><span class="atn">height</span><span class="pun">=</span><span class="atv">"0" </span><span class="atn">name</span><span class="pun">=</span><span class="atv">"test" </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"b.html"</span><span class="tag">> 8 <br> </iframe> 9 <br> <p id="p_nr"></p></span><span class="tag"> 10 <br></body> 11 <br></span><span class="tag"><script</span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="tag">></span><span class="pln"> 12 function testParent</span><span class="pun">(){ 13 <br> alert(‘Parent‘); 14 <br> } 15 <br></span><span class="tag"></script></span><span class="tag"> 16 <br></html></span>
2、b.html里的页面元素为：
1 <span class="tag"><span class="tag"><html> 2 <br></span><span class="tag"><head> 3 <br></span><span class="tag"><title></span><span class="tag"></title></span><span class="tag"> 4 <br></head> 5 <br></span><span class="tag"><body></span> 6 <br><script </span><span class="atn">type</span><span class="pun">=</span><span class="atv">‘text/javascript‘</span><span class="tag">></span><span class="pln"> 7 window</span><span class="pun">.</span><span class="pln">parent</span><span class="pun">.</span><span class="pln">document</span><span class="pun">.</span><span class="pln">getElementById</span><span class="pun">(</span><span class="str">‘p_nr‘</span><span class="pun">).</span><span class="pln">innerHTML </span><span class="pun">=</span><span class="str">‘内容‘</span><span class="pun">;//控制父级页面的元素</span><span class="pln"> 8 window</span><span class="pun">.</span><span class="pln">parent</span><span class="pun">.testParent</span><span class="pun">();//调用父级页面的Js函数 9 <br></span><span class="tag"></script> 10 <br></span>
二、父页面调用Iframe页面中js方法
1、test.js内容
function testJs()
{
alert(‘JS‘);
}
2、Children.html内容
<html>
<head>
<title></title>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
</body>
</html>
3、parent.html内容
<head>
<title></title>
<script type="text/javascript" >
var obj=self.frames[0];
obj.testJs();
</script>
</head>
<body>
</body>
</html>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
