|
javascript/Jscript实现父子窗体的互相引用问题
近来有很多网友问关于如何利用javascipt实现弹出窗体与父窗体功能引用问题。
本人在以前的使用有一些这方面的体验，希望与大家分享一下。希望能对需要的网友有一些帮助。
本文主要以例子为主，文后附有全部源代码。
实现父窗体，子窗体引用的关键在于下面几点：
(1)window.open.函数返回值是弹出子窗体的引用句柄。
(2)得到父窗体引用句柄。这是功能实现的关键,说起来也很简单。
self.opener返回窗体的父窗体。
(3)self,window,parent,top等实现的窗体引用是针对帧(frame/frameset)实现的，跟本文关系不大的。你如果利用parent得不到弹出窗体的父窗体的。
本文只是针对窗体之间引用做简单的分析说明。源代码只是提供简单演示，很不完善，如果使用的话，请自己增加相应的出错检查等功能。
<HTML>
<HEAD>
<TITLE>Welcome to ZosaTapo's WebSite:::::::::Powered By ZosaTapo</TITLE></TITLE>
<SCRIPT LANGUAGE="javascript">
<!--
var child=null;
function testP(){
alert("Message in parent window!");
}
function openwindow(){
if(child==null){
child=window.open("child.htm");
}
}
function callmethod(){
if(child!=null){
child.testC();
}
}
function closewindow(){
if(child!=null){
child.close();
child=null;
}
}
//-->
</SCRIPT>
<style type="text/css">
A:hover{color:#0000FF;text-decoration:underline}
BODY{color:#FFFFFF;font-family:Courier New, Courier, mono}
</style>
</HEAD>
<BODY bgcolor="#000000">
<!--Title content bengin-->
<p align=center ><font size=6 color='#6699cc'><b>Welcome To ZosaTapo Castle</b></font></p>
<!--Body content bengin-->
<b>Watch text Changing:</b><br/>
<INPUT TYPE="text" id="author" value="changed by child"><br/><br/>
<b>Open child Window:</b><br/>
<input type="button" value="Open Child Window" onclick="openwindow();"><br/><br/>
<b>Call child Method:</b><br/>
<input type="button" value="Call Child Method" onclick="callmethod();"><br/><br/>
<b>Close child Window:</b><br/>
<input type="button" value="Close Child Window" onclick="closewindow();"><br/><br/>
<!--Footer content begin-->
<hr width=100%>
<p align=center >Powered By <a href="mailto:dertyang@263.net">Zosatapo</a>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Welcome to ZosaTapo's WebSite:::::::::Powered By ZosaTapo</TITLE></TITLE>
<SCRIPT LANGUAGE="javascript">
<!--
var parwindow=null;
parwindow=self.opener;
function testC(){
alert("Message in child window!");
}
function changetext(){
if(parwindow!=null){
parwindow.document.all("author").value="zosatapo";
}
}
function callmethod(){
if(parwindow!=null){
parwindow.testP();
}
}
function closewindow(){
if(parwindow!=null){
parwindow.close();
parwindow=null;
}
}
//-->
</SCRIPT>
<style type="text/css">
A:hover{color:#0000FF;text-decoration:underline}
BODY{color:#FFFFFF;font-family:Courier New, Courier, mono}
</style>
</HEAD>
<BODY bgcolor="#000000">
<!--Title content bengin-->
<p align=center ><font size=6 color='#6699cc'><b>Welcome To ZosaTapo Castle</b></font></p>
<!--Body content bengin-->
<b>Change parent Text:</b><br/>
<input type="button" value="Change parent Text" onclick="changetext();"><br/><br/>
<b>Call parent Method:</b><br/>
<input type="button" value="Call Parent Method" onclick="callmethod();"><br/><br/>
<b>Close parent Window:</b><br/>
<input type="button" value="Close Parent Window" onclick="closewindow();"><br/><br/>
|
网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）
站内文章搜索
