window.opener用法和用途執行個體介紹

window.opener，是通過window.open開啟子表單的父表單的引用，下面為大家詳細介紹下其具體的使用方法，感興趣的朋友可以參考下

window.opener，是通過window.open開啟子表單的父表單的引用。 

比如在父表單parentForm裡面，通過window.open("subForm.html"),那麼在subform.html中window.opener就代表parentForm。既然在子表單中能夠拿到父表單的引用，那麼就可以在子表單中設定父表單的欄位值或者調用js方法。 
執行個體：新增人員資訊時，其中的機構資訊通過子表單完成輸入 
父親表單，用於新增人員資訊。 

子表單完成輸入後，機構資訊（id、name）自動填滿到父表單的orgId、orgName域

html代碼

<tr> <tdclass="tdEditLabel">機構</td> <tdclass="tdEditContent" colspan="3"style="width:400px;text-align:left"> <input type="hidden"name="orgId" id="orgIdId"> <!-- disabled修飾的內容 不提交 --> <input type="text"name="orgName" disabled="disabled"id="orgNameId"> <input type="button"name="selectOrgButton" value="選擇機構" onclick="openWin('org.do?select=true','selectorg',800,500,1)"> </td> </tr> 

JS代碼

/* *開啟新視窗（通過window.open()） * f:連結地址 * n:視窗的名稱 * w:視窗的寬度 * h:視窗的高度 * s:視窗是否有捲軸，1：有捲軸；0：沒有捲軸 */ functionopenWin(f,n,w,h,s){ sb= s == "1" ? "1" : "0"; l= (screen.width - w)/2; t= (screen.height - h)/2; sFeatures= "left="+ l +",top="+ t +",height="+ h+",width="+ w +",center=1,scrollbars=" + sb +",status=0,directories=0,channelmode=0"; openwin= window.open(f , n , sFeatures ); if(!openwin.opener) openwin.opener= self; openwin.focus(); returnopenwin; } 

子表單，供選擇機構資訊。

當選擇後（通過單擊radio），機構資訊（id、name）將填充到父表單的orgId、orgName域

html代碼

<!--列表資料欄 --> <c:iftest="${!empty pm.datas}"> <c:forEachitems="${pm.datas }" var="org"> <trbgcolor="#EFF3F7" class="TableBody1"onmouseover="this.bgColor = '#DEE7FF';"onmouseout="this.bgColor='#EFF3F7';"> <td align="center"vAlign="center"> <input type="radio"onclick="selectOrg('${org.id }','${org.name }')"> </td> <tdalign="center" vAlign="center">${org.id}</td> <tdalign="center" vAlign="center"><ahref="org.do?parentId=${org.id }&select=true">${org.name}</a></td> <tdalign="center" vAlign="center">${org.sn }</td> <tdalign="center" vAlign="center">${org.parent.name}</td> </tr> </c:forEach> </c:if> 

JS代碼

functionselectOrg(id,name){ if(window.opener){ window.opener.document.all.orgIdId.value= id; window.opener.document.all.orgNameId.value= name; window.close(); } } 

選擇機構資訊後的結果

完成機構資訊（id、name）的輸入了，只是id在隱藏欄位中，看不到而已。 
小結 
說到對父表單的引用，除了window.opener，就是window.parent了。window.opener是用於通過window.open方式開啟子表單，而window.parent是用於通過iframe方式開啟子表單。