首頁 > 開發者 > JavaScript

javascript/Jscript實現父子表單的互相引用問題(Powered By ZosaTapo)

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

Title:
javascript/Jscript實現父子表單的互相引用問題(Powered By ZosaTapo)

Key Words:
javascript jscript 表單引用
 
Content:
近來有很多網友問關於如何利用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>

<!--Footer content begin-->
<hr width=100%>
<p align=center >Powered By <a href="mailto:dertyang@263.net">Zosatapo</a>
</BODY>
</HTML>

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More