jiafang83
posts - 55,comments - 89,trackbacks - 0
iframe父窗口和子窗口的调用方法
转载：http://hi.baidu.com/xeelytech/blog/item/b8e42cfdac841d1508244d42.html



iframe 父窗口和子窗口的调用方法
父窗口调用子窗口
iframe_name.iframe_document_object.object_attribute = attribute_value
例子:onClick="iframe_text.myH1.innerText='http://www.pint.com';"
子窗口调用父窗口parent.parent_document_object.object_attribute = attribute_value
例子:onclick="parent.myH1.innerText='http://www.pint.com';"
上面在IE下没有问题，但在firefox下不正常。在firefox下，应该是
父窗口调用子窗口
window.frames["iframe_name"].document.getElementById("iframe_document_object"-).object_attribute = attribute_value
例子
window.frames["iframe_text"].document.getElementById("myH1").innerHTML= "http://www.pint.com";
子窗口调用父窗口
parent.document.getElementById("parent_document_object").object_attribute = attribute_value
例子
parent.document.getElementById("myH1").innerHTML = "http://www.adsf.com";

 

完整例子：
start.html

<html>
<script type="text/javascript">
function b(){
    alert("父窗口编辑子窗口的内容。。。");
    window.frames["floater"].document.getElementById("bb").innerHTML="父窗口改变子窗口内容";
    //下句只适合IE浏览器
    //floater.bb.innerText="父窗口修改子窗口内容。。。";
}
</script>
<body>
<IFRAME name="floater" src="three.html" width=1000 height=600 hspace=20 vspace=20 align=right frameborder=1>
</IFRAME><BR>
<img src="星球大战.jpg" /><br>
<A id="aa" href="one.html" target="floater">Show one.htm</A><P> 
<form id="a" action="#" method="post">
<input type=button value="修改子窗口内容" onclick="b()">
</form>
</body>
</html>

one.html

<html>
one.html
</html>

three.html

<html>
<script typt="text/javascript">
function a(){
    alert("子窗口编辑父窗口内容parent表示父窗口");
    //下句只适合IE浏览器
    //parent.aa.innerText="ppppppppppppp";
    parent.document.getElementById("aa").innerHTML="修改父窗口内容";
    //parent.frames["iframe的名称"].document.getElementById("aa").innerText="修改父窗口内容。。。。";
    //子窗口修改父窗口的另一个子窗口的内容
}
</script>
<body onload="a()">
<h1 id="bb">改变父窗口的元素值。</h1>
</body>
</html>
posted on 2009-03-29 15:53 jiafang83 阅读(6295) 评论(0)  编辑  收藏
Copyright ©2024 jiafang83 Powered By博客园 模板提供：沪江博客