As we all know, the window. open () function can be used to open a new window. How can we pass a value to the parent form in the child form? In fact, the reference of the parent form can be obtained through window. opener.
For example, our new window fatherpage.htm:
XML-Code:
<Script type = "text/javascript"> function OpenChildWindow () {your own open('childpage.htm ');} </script> <input type = "text" id = "txtInput"/> <input type = "button" value = "OpenChild" onclick = "OpenChildWindow ()"/>
Then, you can use window. opener in childpage.htm to access elements in the parent form:
XML-Code:
<Script type = "text/javascript"> function SetValue () {extends opener.doc ument. getElementById ('txtinput '). value = document. getElementById ('txtinput '). value; window. close ();} </script> <input type = "text" id = "txtInput"/> <input type = "button" value = "SetFather" onclick = "SetValue ()"/>
The secret can be changed:
XML-Code:
<Script type = "text/javascript"> function OpenChildWindow () {var child = mongomongoopen('childpage.htm'); child.doc ument. getElementById ('txtinput '). value = document. getElementById ('txtinput '). value ;}</script> <input type = "text" id = "txtInput"/> <input type = "button" value = "OpenChild" onclick = "OpenChildWindow () "/>
By judging whether the subform reference is null, we can also control that it can only open one subform:
XML-Code:
<Script type = "text/javascript"> var childfunction OpenChildWindow () {if (! Child) child = childpage.htm '); child.doc ument. getElementById ('txtinput '). value = document. getElementById ('txtinput '). value ;}</script> <input type = "text" id = "txtInput"/> <input type = "button" value = "OpenChild" onclick = "OpenChildWindow () "/>
This is not enough. When the child form is closed, the child variable of the parent form must be cleared; otherwise, the child form cannot be re-opened after it is closed:
XML-Code:
<Body onunload = "Unload ()"> <script type = "text/javascript"> function SetValue () {extends opener.doc ument. getElementById ('txtinput '). value = document. getElementById ('txtinput '). value; window. close ();} function Unload () {window. opener. child = null ;} </script> <input type = "text" id = "txtInput"/> <input type = "button" value = "SetFather" onclick = "SetValue () "/> </body>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
