Javascript 两个窗体之间传值实现代码


Posted in Javascript onSeptember 25, 2009

如我们新建窗体FatherPage.htm:
XML-Code:

<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:
<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()" />

其实在打开子窗体的同时,我们也可以对子窗体的元素进行赋值,因为window.open函数同样会返回一个子窗体的引用,因此FatherPage.htm可以修改为:
XML-Code:
<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()" />

通过判断子窗体的引用是否为空,我们还可以控制使其只能打开一个子窗体:
XML-Code:
<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()" />

光这样还不够,当关闭子窗体时还必须对父窗体的child变量进行清空,否则打开子窗体后再关闭就无法再重新打开了:
XML-Code:
<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>
Javascript 相关文章推荐
网页自动刷新,不产生嗒嗒声的一个解决方法
Mar 27 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 Javascript
jQuery获得IE版本不准确webbrowser的解决方法
Feb 23 Javascript
jQuery前端分页示例分享
Feb 10 Javascript
举例详解AngularJS中ngShow和ngHide的使用方法
Jun 19 Javascript
javascript封装 Cookie 应用接口
Aug 07 Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
Sep 07 Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 Javascript
bootstrap 弹出框modal添加垂直方向滚轴效果
Jul 09 Javascript
Vue CLI3搭建的项目中路径相关问题的解决
Sep 17 Javascript
Typescript3.9 常用新特性一览(推荐)
May 14 Javascript
基于vue+element实现全局loading过程详解
Jul 10 Javascript
jQuery 使用手册(七)
Sep 23 #Javascript
jQuery 使用手册(六)
Sep 23 #Javascript
jQuery 使用手册(五)
Sep 23 #Javascript
jQuery 使用手册(四)
Sep 23 #Javascript
jQuery 使用手册(三)
Sep 23 #Javascript
jQuery 使用手册(二)
Sep 23 #Javascript
jQuery 使用手册(一)
Sep 23 #Javascript
You might like
php方法调用模式与函数调用模式简例
2011/09/20 PHP
基于PHP编程注意事项的小结
2013/04/27 PHP
基于php和mysql的简单的dao类实现crud操作功能
2014/01/27 PHP
大家在抢红包,程序员在研究红包算法
2015/08/31 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
php之可变变量的实例详解
2017/09/12 PHP
新鲜出炉的js tips提示效果
2011/04/03 Javascript
js弹出框轻量级插件jquery.boxy使用介绍
2013/01/15 Javascript
js动态创建、删除表格示例代码
2013/08/07 Javascript
nodejs个人博客开发第七步 后台登陆
2017/04/12 NodeJs
vue上传图片组件编写代码
2017/07/26 Javascript
利用vue + element实现表格分页和前端搜索的方法
2017/12/25 Javascript
Angular5中提取公共组件之radio list的实例代码
2018/07/10 Javascript
Node.js + express基本用法教程
2019/03/14 Javascript
微信网页登录逻辑与实现方法
2019/04/29 Javascript
基于JS正则表达式实现模板数据动态渲染(实现思路详解)
2020/03/07 Javascript
浅析VUE防抖与节流
2020/11/24 Vue.js
[48:48]完美世界DOTA2联赛PWL S3 Magama vs GXR 第一场 12.19
2020/12/24 DOTA
Python 开发Activex组件方法
2009/11/08 Python
python设置检查点简单实现代码
2014/07/01 Python
动感网页相册 python编写简单文件夹内图片浏览工具
2016/08/17 Python
简单谈谈python中的lambda表达式
2018/01/19 Python
Python Django Vue 项目创建过程详解
2019/07/29 Python
如何一键升级Python所有包
2020/11/05 Python
PyCharm+Miniconda3安装配置教程详解
2021/02/16 Python
美国球鞋寄卖网站:Stadium Goods
2018/05/09 全球购物
DC Shoes澳大利亚官方网上商店:购买DC鞋子
2019/10/25 全球购物
团支书的期末学习总结自我评价
2013/11/01 职场文书
航空大学应届生求职信
2013/11/10 职场文书
会计专业自荐信
2013/12/02 职场文书
班组安全员工作职责
2014/02/01 职场文书
遗嘱公证书标准样本
2014/04/08 职场文书
查摆问题整改措施
2014/10/24 职场文书
初二英语教学反思
2016/02/15 职场文书
Angular性能优化之第三方组件和懒加载技术
2021/05/10 Javascript
SQL解决未能删除约束问题drop constraint
2022/05/30 SQL Server