ADOU-V

导航

iframe父窗体和子窗体的相互调用

父窗体

HTML代码：

 1     <html>  
 2         <head>  
 3             <title>usually function</title>  
 4         </head>  
 5         <body>  
 6               
 7             <iframe src="http://www.baidu.com" ></iframe>  
 8               
 9             <iframe src="myifame.html" id="name_iframe" name="name_iframe"></iframe>  
10               
11             <button value="buttonvalue" id="testid">buttonvalue</button>  
12         </body>  
13     <html>      
14     <script type="text/javascript" src="jquery-1.4.4.js"></script>  
15     <script>  
16     //contentWindow这个属性，相当于获取iframe网页里面的window对象  
17     $(function(){  
18         //父窗体获取子窗体的变量  
19         alert(document.getElementById("name_iframe").contentWindow.vname);//父窗体获取子窗体的方法  
20         document.getElementById("name_iframe").contentWindow.test();//父窗体获取子窗体的内容  
21         alert(document.getElementById("name_iframe").contentWindow.document.body.outerHTML);  
22     });  
23       
24     var myname="hb";  
25     function parentFunction(){  
26         alert("parentFunction");  
27     }  
28           
29     </script>

子窗体

HTML代码：

 1     <html>  
 2         <head>  
 3             <title>usually function</title>  
 4         </head>  
 5         <body>  
 6               
 7             <button onclick="getParentContent()">getParentContent</button>  
 8         </body>  
 9     <html>      
10     <script type="text/javascript" src="jquery-1.4.4.js"></script>  
11     <script>  
12       
13     var vname="v_name";   
14     function test(){  
15         alert("function test");  
16     }  
17       
18     function getParentContent(){  
19         //获取父窗体的变量  
20         alert(window.parent.myname);  
21         //获取父窗体的方法  
22         window.parent.parentFunction();  
23         //获取父窗体的dom节点  
24         alert(parent.document.getElementById("testid").value);  
25     }  
26           
27     </script>

 

posted on 2015-03-25 17:10  a-dou  阅读(201)  评论(0)    收藏  举报