子視窗和父視窗互動

最近項目開發中需要子視窗和父視窗互動的内容，基本上無非就是把子視窗的資訊傳遞給父視窗，并且關閉自己等等，或者是父視窗把自己的資訊傳遞給子視窗等等。

1。父視窗傳遞資訊給子視窗

看代碼執行個體：

<script language=javascript>

function outPut()

{

 //擷取父視窗的文本資訊指派給text

 var text = document.abc.text.value;

 //打開子視窗，并且把操作句柄指派給win變量，以下所有操作都是針對win對象的

 var win = window.open("","mywin", "menubar=no,width=400,height=100,resizeable=yes");

 //輸出基本資訊

 win.document.writeln("<title>輸出結果</title>");

 win.document.writeln("你的資訊是：<p>");

 //輸出從父視窗擷取的資訊

 win.document.writeln(text);

 win.document.close();

 win.focus();

}

</script>

<form name=abc method=post>

<input type=text name=text size=50>

//調用上面的函數

<input type=button value=送出 onClick="outPut()">

</form>

2。子視窗傳遞參數給父視窗

我們對上面的代碼進行改造：

 win.document.writeln("<input type=text name=child value=子視窗資訊>");

 //對子視窗本身操作，使用self對象，對父視窗操作使用opener對象，這是關鍵

 //把子視窗中表單的值回傳給父視窗，取代父視窗表單以前的值，然後關閉子視窗

 win.document.writeln("<input type=button value=關閉自己 onClick='window.opener.abc.text.value=self.child.value;self.close()'>");

 //可以控制關閉父視窗

 win.document.writeln("<input type=button value=關閉父視窗 onClick='window.opener.opener=null;window.opener.close()'>");

 //重新整理父視窗

 win.document.writeln("<input type=button value=重新整理父視窗 onClick='window.opener.location.reload()'>");

3。不是同頁面的子視窗和父視窗互動

假設我們涉及到外部程式，比如php、asp等等，那麼我們處理的可能是兩個頁面，比如，上傳功能，我們就是需要打開一個新頁面，然後再把新頁面中的值傳遞給父頁面。

局部代碼執行個體：

<input type="input" value="" name="input_tag" id = "input_tag" onKeyUp="clearPreTagStyle()" size="40">

<input type="hidden" value="0" name="tagid" id="tagid">

<input type="button" value="标簽" onclick="popUpWindow('tag.php?tag='+escape(document.tryst_form.input_tag.value))">

以上是父視窗的部分代碼，裡面的popUpWindow是封裝好的window.open函數，是以了解面面的tag.php是另外一個頁面就可以，我們需要把目前表單中的值送出給tag.php頁面去處理。

tag.php部分代碼：

查詢标簽結果：

<a href="#" name="tag_1">生活</a><a href="#" onclick="opener.document.tryst_form.input_tag.value = document.tag_1.innerHTML">加入該标簽</a>

<a href="#" name="tag_2">生活秀</a><a href="#" onclick="opener.document.tryst_form.input_tag.value = document.tag_2.innerHTML">加入該标簽</a>

這個就是我們的子視窗，我們要把tag_1和tag_2傳回到子視窗中，雖然他們不是同一個頁面。這裡有個知識點，就是我們如何擷取連接配接中的值，我們使用innerHTML屬性：document.tag_2.innerHTML 這個就是我們擷取了tag_2的值“生活秀”，我們也能使用其他方法擷取，比如：document.all.tag_2.innerHTML，或者this.innerHTML就是指本身的連結的值。

通路父視窗也是使用opener對象來處理：opener.document.tryst_form.input_tag.value，就能夠改變父視窗的值。

1. 在Asp.net實用技巧（1） 中提到了如何重新整理父頁面，那麼如果要重新整理父頁面的父頁面的父頁面了？那就是重新整理祖先頁面RefreshAncestorPage。

RefreshAncestorPageRefreshAncestorPage

2.如何重新整理祖先頁面中的某個frame中的page了？

RefreshFrameInAncestorPageRefreshFrameInAncestorPage

3.如何重新整理本頁面中的其它架構了？

RefreshTargetFrameInSamePageRefreshTargetFrameInSamePage 

4.如何調用祖先頁面的腳本？

CallAncestorScriptMethodCallAncestorScriptMethod

本文轉自高海東部落格園部落格，原文連結：http://www.cnblogs.com/ghd258/archive/2006/03/01/340305.html，如需轉載請自行聯系原作者

5.如何調用本頁面中其它架構page的腳本？

CallTargetFrameScriptMethodInSamePageCallTargetFrameScriptMethodInSamePage