window.opener用法和用途实例介绍


Posted in Javascript onAugust 19, 2013

window.opener,是通过window.open打开子窗体的父窗体的引用。

比如在父窗体parentForm里面,通过window.open("subForm.html"),那么在subform.html中window.opener就代表parentForm。既然在子窗体中能够拿到父窗体的引用,那么就可以在子窗体中设置父窗体的字段值或者调用js方法。
实例:添加人员信息时,其中的机构信息通过子窗体完成输入
父亲窗体,用于添加人员信息。

子窗体完成输入后,机构信息(id、name)自动填充到父窗体的orgId、orgName域
window.opener用法和用途实例介绍 
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域
window.opener用法和用途实例介绍 
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(); 
} 
}

选择机构信息后的结果
window.opener用法和用途实例介绍 
完成机构信息(id、name)的输入了,只是id在隐藏域中,看不到而已。
小结
说到对父窗体的引用,除了window.opener,就是window.parent了。window.opener是用于通过window.open方式打开子窗体,而window.parent是用于通过iframe方式打开子窗体。
Javascript 相关文章推荐
FusionCharts图表显示双Y轴双(多)曲线
Nov 22 Javascript
解析js原生方法创建表格效率测试
Jul 08 Javascript
jQuery中height()方法用法实例
Dec 24 Javascript
AngularJS内置指令
Feb 04 Javascript
基于jQuery实现的仿百度首页滑动选项卡效果代码
Nov 16 Javascript
Angular2学习笔记——详解NgModule模块
Dec 02 Javascript
详解使用fetch发送post请求时的参数处理
Apr 05 Javascript
javascript基于定时器实现进度条功能实例
Oct 13 Javascript
VUE2实现事件驱动弹窗示例
Oct 21 Javascript
web前端页面生成exe可执行文件的方法
Feb 08 Javascript
Auto.JS实现抖音刷宝等刷视频app,自动点赞,自动滑屏,自动切换视频功能
May 08 Javascript
微信小程序实现时间戳格式转换
Jul 20 Javascript
JavaScript异步编程:异步数据收集的具体方法
Aug 19 #Javascript
文本框中禁止非数字字符输入比如手机号码、邮编
Aug 19 #Javascript
JQUERY 获取IFrame中对象及获取其父窗口中对象示例
Aug 19 #Javascript
时间戳转换为时间 年月日时间的JS函数
Aug 19 #Javascript
详解JavaScript函数绑定
Aug 18 #Javascript
jQuery 绑定事件到动态创建的元素上的方法实例
Aug 18 #Javascript
jQuery焦点图切换特效插件封装实例
Aug 18 #Javascript
You might like
提高php运行速度的一些小技巧分享
2012/07/03 PHP
php缩小png图片不损失透明色的解决方法
2013/12/25 PHP
PHP中Notice错误常见解决方法
2017/04/28 PHP
js继承的实现代码
2010/08/05 Javascript
JQuery 应用 JQuery.groupTable.js
2010/12/15 Javascript
用javascript读取xml文件读取节点数据
2014/08/12 Javascript
javascript超过容器后显示省略号效果的方法(兼容一行或者多行)
2016/07/14 Javascript
js事件驱动机制 浏览器兼容处理方法
2016/07/23 Javascript
ES6中的Promise代码详解
2017/10/09 Javascript
Vuex的初探与实战小结
2018/11/26 Javascript
js常见遍历操作小结
2019/06/06 Javascript
小程序调用微信支付的方法
2019/09/26 Javascript
vue-iview动态新增和删除的方法
2020/06/17 Javascript
JS将指定的某个字符全部转换为其他字符实例代码
2020/10/13 Javascript
python实现的系统实用log类实例
2015/06/30 Python
Python3.2模拟实现webqq登录
2016/02/15 Python
python扫描proxy并获取可用代理ip的实例
2017/08/07 Python
python psutil库安装教程
2018/03/19 Python
python做反被爬保护的方法
2019/07/01 Python
Python实现基于SVM的分类器的方法
2019/07/19 Python
关于Python3 类方法、静态方法新解
2019/08/30 Python
Tensorflow实现部分参数梯度更新操作
2020/01/23 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
使用Python操作MySQL的小技巧
2020/09/10 Python
moosejaw旗下的户外商品促销网站:Mountain Steals
2017/02/27 全球购物
JBL澳大利亚官方商店:扬声器、耳机和音响系统
2018/05/24 全球购物
德国自行车商店:Tretwerk
2019/06/21 全球购物
中医药大学毕业生自荐信
2013/11/08 职场文书
校园安全教育广播稿
2014/02/17 职场文书
入党介绍人评语
2014/05/06 职场文书
2015年外联部工作总结
2015/04/03 职场文书
火烧圆明园观后感
2015/06/03 职场文书
高一地理教学工作总结
2015/08/12 职场文书
分析JVM源码之Thread.interrupt系统级别线程打断
2021/06/29 Java/Android
DIV CSS实现网页背景半透明效果
2021/12/06 HTML / CSS
Win11怎么修改电源模式?Win11修改电源模式的方法
2022/04/05 数码科技