父窗體與子窗體之間的通信

在之前文章講解windows程序設計過程中，我們曾描述了windows程序窗口之間通信與控制實現方法與過程，如窗體之間參數傳遞等。本文主要從Web程序開發前端JavaScript腳本語言角度對窗體之間的通信及控制進行說明。

---

window對象

window對象是是BOM中其他所有對象的父對象，其很多屬性本身就是它的子對象。通俗理解當瀏覽器中每打開一個窗口就會創建一個window對象的實例。JavaScript程序語言可以通過該實例實現對窗體進行控制。window對象基本屬性描述如下圖：

window對象常用屬性

window對象常用屬性描述如上圖，其中與窗口參數傳遞與控制相關屬性主要包括parent屬性、opener屬性及closed屬性等。各屬性描述如下：

1、parent屬性

該屬性是指包含當前窗口的父窗口，此處包含多用在框架結構中，框架頁面是構成框架的各個子頁面的parent。

2、opener屬性

opener屬性主要針對使用open方法打開的窗口，被打開的窗口即為子窗口，其父親窗口為opener。

3、closed屬性

該屬性主要用于判斷一個窗口是否被關閉，如被關閉則返回true邏輯值。

4、screen屬性

該屬性主要是指與終端瀏覽器尺寸相關值，主要包括屏幕的寬度、高度等。

以上給出了window對象基本屬性，除以上基本屬性之外，JavaScript還提供了window對象常用操作方法，方法描述如下：

window對象常用方法

window對象常用方法描述如上圖所示，其中與窗口打開相關函數主要包括open方法、close方法等。說明如下：

1、open()方法

該方法主要用于實現打開一個窗口，并對打開窗口URL及相關屬性進行設置。函數返回值為被打開窗口的標識。

2、close()方法

該方法主要用于實現關閉窗口，關閉窗口可以針對本身，也可以針對子窗口進行關閉操作。

---

父子窗口通信

web中的父子窗口主要是指打開的網頁，子窗口為被打開的網頁，打開者為父窗口。本文所指的父子窗口通信主要包括參數的傳遞與方法調用。描述如下：

父窗口與子窗口通信

父窗口與子窗口通信主要借助窗口句柄或者窗口標識實現，在獲取句柄或者標識后可以使用方法與屬性進行操作，下面我們對參數傳遞及方法調用進行實例分析與說明。

1、父傳子參數傳遞

參數傳遞主要包括子窗口傳父窗口或者父窗口傳主窗口兩類。為演示操作，我們在主窗口與子窗口中分別添加文本框用于接收數據。效果如下圖所示：

參數傳遞測試Demo

參數傳遞測試Demo如上圖，當父窗口點擊發送數據到子窗口時，將子窗口中的文本框用于顯示所發送的數據。該功能實現主要借助于主窗口在打開子窗口時獲取子窗口的句柄即標識。然后根據子窗口句柄操作子窗口文本框設置值。實現核心代碼如下：

父窗口傳遞數據給子窗口

父窗口傳遞數據給子窗口實現代碼如上所示，主要借助childWind句柄獲取子窗口的文本框設置其Value值。實現效果如下圖：

父傳子實現窗口

2、子傳父參數傳遞

子傳父參數傳遞主要借助子窗口的opener屬性獲取主窗口，并設置主窗口文本字段值。在子窗口中為發送數據按鈕編寫onclick點擊處理函數，函數如下：

子傳父實現代碼

如上圖通過opener屬性獲取父窗口句柄后可直接調用父窗口的getElementById獲取其對話框并設置父窗口文本框的Value實現子向父親傳遞參數。實現效果如下圖：

子傳父功能實現

3、命令操作的傳遞

理論上將無論父窗口還是子窗口只要獲取了對方的句柄即標識之后，就可以調用對方window窗體的方法執行操作。如父窗體關閉前可直接調用子窗體的close方法先關閉子窗體。實現代碼如下：

父窗體關閉子窗體

以上給出JavaScript開發過程中父窗口與子窗口通信的實現及相關案例代碼演示，如需完整代碼請關注并私信。在測試過程中通過父窗口獲取子窗口并進行操作在Chrome瀏覽器下受到跨源請求規范約束無法執行代碼，其他瀏覽器均可正常執行。

---

本頭條號長期關注編程資訊分享；編程課程、素材、代碼分享及編程培訓。如果您對以上方面有興趣或代碼錯誤、建議與意見，可在評論區回復。更多程序設計相關教程及實例分享，期待大家關注與閱讀！相關文章鏈接如下：

前端設計-JavaScript實現Node節點的遍歷

Web前端設計-常用CSS選擇器說明及實例分析(二)

Web前端設計-常用CSS選擇器說明及實例分析(一)

總結

以上是生活随笔為你收集整理的mfc获取子窗口句柄_前端设计-JavaScript中父窗口与子窗口间的通信的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。