 
<script type="text/javascript"> 
function OpenChildWindow() 
{ 
window.open('ChildPage.htm'); 
} 
</script> 
<input type="text" id="txtInput" /> 
<input type="button" value="OpenChild" onclick="OpenChildWindow()" /> 

然后在ChildPage.htm中即可通過window.opener來訪問父窗體中的元素：
XML-Code:

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
function SetValue() 
{ 
window.opener.document.getElementById('txtInput').value 
=document.getElementById('txtInput').value; 
window.close(); 
} 
</script> 
<input type="text" id="txtInput" /> 
<input type="button" value="SetFather" onclick="SetValue()" /> 

其實(shí)在打開子窗體的同時(shí)，我們也可以對(duì)子窗體的元素進(jìn)行賦值，因?yàn)閣indow.open函數(shù)同樣會(huì)返回一個(gè)子窗體的引用，因此FatherPage.htm可以修改為：
XML-Code:

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
function OpenChildWindow() 
{ 
var child = window.open('ChildPage.htm'); 
child.document.getElementById('txtInput').value 
=document.getElementById('txtInput').value; 
} 
</script> 
<input type="text" id="txtInput" /> 
<input type="button" value="OpenChild" onclick="OpenChildWindow()" /> 

通過判斷子窗體的引用是否為空，我們還可以控制使其只能打開一個(gè)子窗體：
XML-Code:

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
var child 
function OpenChildWindow() 
{ 
if(!child) 
child = window.open('ChildPage.htm'); 
child.document.getElementById('txtInput').value 
=document.getElementById('txtInput').value; 
} 
</script> 
<input type="text" id="txtInput" /> 
<input type="button" value="OpenChild" onclick="OpenChildWindow()" /> 

光這樣還不夠，當(dāng)關(guān)閉子窗體時(shí)還必須對(duì)父窗體的child變量進(jìn)行清空，否則打開子窗體后再關(guān)閉就無法再重新打開了：
XML-Code:

復(fù)制代碼代碼如下:

 
<body onunload="Unload()"> 
<script type="text/javascript"> 
function SetValue() 
{ 
window.opener.document.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> 

您可能感興趣的文章:

相關(guān)文章

使用 JavaScript如何獲取當(dāng)月的第一天和最后一天
這篇文章主要介紹了使用 JavaScript如何獲取當(dāng)月的第一天和最后一天,通過本文學(xué)習(xí)了如何使用 JavaScript 中的Date.getFullYear()和?Date.getMonth()方法獲得某個(gè)特定月份的第一天和最后一天，需要的朋友可以參考下
2023-05-05
Firefox下無法正常顯示年份的解決方法
在用Firefox上一些網(wǎng)站會(huì)看到這樣的顯示108年1月26日，而IE顯示為2008年1月26日原因是javascrīpt的兼容性問題
2014-09-09
JavaScript轉(zhuǎn)換農(nóng)歷類實(shí)現(xiàn)及調(diào)用方法
農(nóng)歷是日常生活中不可或缺的一部分，它與人類的生活息息相關(guān)，從某種程度上說，它一直伴隨著我們，今天的任務(wù)是JavaScript轉(zhuǎn)換農(nóng)歷類的實(shí)現(xiàn)，感興趣的你可以千萬不要錯(cuò)過，希望本文對(duì)你有所幫助
2013-01-01
怎樣使你的 JavaScript 代碼簡單易讀（推薦）
這篇文章主要介紹了怎樣使你的 JavaScript 代碼簡單易讀，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04
如何使JavaScript休眠或等待
在本文中，我將解釋如何使用 setTimeout()，包括如何使用它來制作一個(gè)睡眠函數(shù)，使JavaScript暫停執(zhí)行并在連續(xù)的代碼行之間等待。
2021-04-04
jQuery?事件綁定及取消?bind?live?delegate?on?one區(qū)別解析
這篇文章主要介紹了jquery?事件綁定及取消?bind?live?delegate?on?one區(qū)別解析，本文給大家講解的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2022-11-11
微信小程序搜索框組件代碼實(shí)例
這篇文章主要介紹了微信小程序搜索框組件代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-09-09
javascript復(fù)制粘貼與clipboardData的使用
window.clipboardData可以實(shí)現(xiàn)復(fù)制與粘貼的操作，下面有個(gè)小示例，想學(xué)習(xí)的朋友可以參考下
2014-10-10
JavaScript模塊化原理深入分析
JavaScript中的模塊化是指將每個(gè)js文件會(huì)被認(rèn)為單獨(dú)一個(gè)的模塊。模塊之間是互相不可見的。如果一個(gè)模塊需要使用另一個(gè)模塊，那么需要通過指定語法來引入要使用的模塊，而且只能使用引入模塊所暴露的內(nèi)容
2022-11-11
利用JS判斷元素是否為數(shù)組的方法示例
這篇文章主要給大家介紹了關(guān)于利用JS判斷元素是否為數(shù)組的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2021-01-01