JavaScript iframe Parent window and child window implementation code

Source: Internet
Author: User

One, the parent window invokes the iframe child window method
1, HTML syntax: <iframe name= "MyFrame" src= "child.html" ></iframe>
2, Parent window Call Child window: Myframe.window.functionname ();
3, sub-window products call the parent window: Parent.functionname ();
Simply put, a parent is added before a variable or function that is called in a child window. On line
4, the parent window page source code:
Copy Code as follows:
<script Type= "text/web Effects" >
function Say () {
Alert ("parent.html------>i ' m at Parent.html");
}
Function Callchild ()
{
//document.frames ("MyFrame"). F1 ();
Myframe.window.say ();
}
</script>
<body>
<input Type=button value= "invoke functions in Child.html say ()" Onclick= "Callchild ()" >
<iframe name= "MyFrame" src= "child.html" ></iframe>
</body>
& Lt;/html>

5, child window page:
Copy code code as follows:
<script type= "Text/javascript" >
function Say ()
{
Alert ("Child.html--->i ' m at Child.html");
}
function Callparent () {
Parent.say ();
}
</script>
<body>
<input Type=button value= "invoke say () function in parent.html" onclick= "Callparent ()" >
</body>

Two, the iframe parent window and the child window mutually calls the method
1, ie in the use of methods:
Parent window Call Child window: Iframe_id.iframe_document_object.object_attribute = Attribute_value
Example: onclick= "iframe_text.myh1.innertext= ' http://www.pint.com ';"
child window Call Parent window: Parent.parent_document_object.object_attribute = Attribute_value
Example: onclick= "parent.myh1.innertext= ' http://www.pint.com ';"
2, Firefox use methods:
Above in IE no problem, but under Firefox is not normal. Under Firefox, it should be the following calling method:
Parent window Call Child window: window.frames["iframe_id"].document.getelementbyid ("Iframe_document_object"). Object_attribute = Attribute_value
Example: window.frames["Iframe_text"].document.getelementbyid ("Myh1"). innerhtml= "Http://hi.111cn.net";
child window calls the parent window: Parent.document.getelementbyid ("Parent_document_object"). Object_attribute = Attribute_value
Example: Parent.document.getelementbyid ("Myh1"). innerHTML = "Http://111cn.net";
3, The complete example
Test.htm
Copy code code as follows:
<title> test Page </title>
<script src= "Prototype-1.4.0.js" ></script>
<script language= "JavaScript" >
Function Show ()
{
window.frames["Iframe_text"].document.getelementbyid ("Myh1"). innerHTML = "Http://hi.111cn.net";
}
</script>
<body>
<iframe height= "width=" src= "iframe_test.htm" name= "Iframe_text" ></iframe>
<form action= "" method= "POST" >
<input name= "haha" id= "haha" type= "text" maxlength= "" value= "haha"/>
<br/>
<textarea cols= "rows=" 5 "id=" Getattributemethod "></textarea>
<input type= "button" onclick= "Show ();" value= "Submit"/>
</form>
&LT;H1 id= "Myh1" >d</body>

Frame_test.htm
Copies code code as follows:
<!doctype HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.or G/tr/xhtml1/dtd/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type content=" text/html; charset=gb2312 "/>
<title> Untitled Document </ Title>
<script language= "javascript" >
function Show ()
{
Parent.document.ge Telementbyid ("Myh1"). innerHTML = Http://111cn.net;
}
</script>
<body>

<form action= "" method= "POST" >
<input name= "abc" id= "abc" type= "Text" maxlength= "" value= "abc"/>
<br/>
<textarea C ols= "rows=" id= "text" ></textarea>
<br/>
<input type= "button" value= "Submit" onclick= " Show (); " />
</form>
</body>

Test.htm inside Firefox to access the IFRAME must use name, cannot use ID, so change to Name= "Iframe_test". (http://chenling1018.blog.163.com/blog/static/1480254200811891041694/)
Third, how to dynamically change the SRC value of the IFRAME in C #, dynamically pointing to a Web page
1 If it is a JavaScript script
add an ID to the IFRAME such as <iframe id=frmlist ...
in script write
Frmlist.document.location=strnewurl
2) If it is a daemon
add an ID to the IFRAME plus runat=server such as <iframe id= Frmlist Runat=server ...
Write in program
Frmlist.attributes.add ("src", strnewurl);

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.