iframe 父窗口和子窗口相互的调用方法集锦

iframe 父窗口和子窗口相互的调用方法集锦

一、父窗口调用iframe子窗口方法

1、HTML语法:

2、父窗口调用子窗口:myFrame.window.functionName();

3、子窗品调用父窗口:parent.functionName();

简单地说,也就是在子窗口中调用的变量或函数前加个parent.就行

4、父窗口页面源码:

  1. <html>   
  2. <head>   
  3. <script   type="text/javascript">   
  4. function say() {
  5.    alert("parent.html------>I'm at parent.html");
  6.    } 
  7. function callChild()
  8. {   
  9.    //document.frames("myFrame").f1();
  10.    myFrame.window.say();
  11. }   
  12. script>   
  13. head>   
  14.     
  15. <body>     
  16. <input   type=button   value="调用child.html中的函数say()" onclick="callChild()"> 
  17. <iframe name="myFrame" src="child.html">iframe> 
  18. body>   
  19. html>  

5、子窗口页面:

  1. <html>   
  2. <head>   
  3. <script type="text/javascript">
  4.       
  5. function say()   
  6. {   
  7.           alert("child.html--->I'm at child.html");   
  8. function callParent() {
  9.    parent.say();
  10.    } 
  11. script>   
  12. head>   
  13. <body>   
  14. <input   type=button   value="调用parent.html中的say()函数"   onclick="callParent()">   
  15. body>   
  16. html>

二、iframe 父窗口和子窗口相互的调用方法

1、IE中使用方法:

父窗口调用子窗口:iframe_ID.iframe_document_object.object_attribute = attribute_value
例子:onClick="iframe_text.myH1.innerText='http://www.pint.com';"
子窗口调用父窗口:parent.parent_document_object.object_attribute = attribute_value
例子:οnclick="parent.myH1.innerText='http://www.pint.com';"

2、Firefox中使用方法:

上面在IE下没有问题,但在firefox下不正常。在firefox下,应该是如下调用方法:

父窗口调用子窗口:window.frames["iframe_ID"].document.getElementById("iframe_document_object"­).object_attribute = attribute_value 
例: window.frames["iframe_text"].document.getElementById("myH1").innerHTML= "http://hi.wonsoft.cn";
子窗口调用父窗口:parent.document.getElementById("parent_document_object").object_attribute = attribute_value 
例: parent.document.getElementById("myH1").innerHTML = "http://wonsoft.cn";

3、完整的例子
test.htm

  1. <HTML>
  2.     <HEAD>
  3.         <TITLE> Test Page TITLE>
  4.         <script src="prototype-1.4.0.js">script>
  5.         <script language="javascript">
  6.             function show()
  7.             {
  8.                 window.frames["iframe_text"].document.getElementById("myH1").innerHTML = "http://hi.wonsoft.cn";
  9.             }
  10.         script> 
  11.     HEAD>
  12.     <BODY>
  13.         <iframe height="350"  width="600" src="iframe_test.htm" name="iframe_text">iframe>
  14.         <form action="" method="post">
  15.             <input name="haha" id="haha" type="text" maxlength="30" value="haha" />
  16.             <br />
  17.             <textarea cols="50" rows="5" id="getAttributeMethod">textarea>
  18.             <input type="button" onClick="show();" value="提交"/>
  19.         form>
  20.         <h1 id="myH1">dh1>
  21.     BODY>
  22. HTML>

 frame_test.htm

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2.   <head>
  3.     <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4.     <title>无标题文档title>
  5.   head>
  6.   <script language="javascript">
  7.     function show()
  8.     {
  9.       parent.document.getElementById("myH1").innerHTML = http://wonsoft.cn
  10.     }
  11.   script>
  12.   <body>
  13.     <h1 id="myH1">hah1>
  14.     <form action="" method="post">
  15.       <input name="abc" id="abc" type="text" maxlength="30" value="abc" />
  16.       <br />
  17.       <textarea cols="50" rows="10" id="text">textarea>
  18.       <br />
  19.       <input type="button" value="提交" onclick="show();"/>
  20.     form>
  21.   body>
  22. html>

test.htm里面firefox下访问iframe 必须用name,不能用id,所以要改为name="iframe_test" 。(http://chenling1018.blog.163.com/blog/static/1480254200811891041694/)

 

三、在c#中如何动态改变iframe的src值,动态指向一个网页

1)如果是javascript脚本  
  给iframe加一个ID如  在脚本写  
  frmList.document.location=strNewUrl   

2)如果是后台程序  
  给iframe加一个ID,再加上runat=server   如  在程序里写  
  frmList.Attributes.Add("src",strNewUrl);

你可能感兴趣的:(ASP,.NET,iframe,firefox,javascript,button,object,server)