window.showModalDialog 与window.open传递参数的不同?
简单的说,就是一个在弹出窗口之后可以做其它的事,即window.open
另一个在弹出窗口之后不能做其它的事,只能是关闭了当前的窗口之后才能做其它的事,即window.showModalDialog
那么两者在使用上有什么不同呢?他们分别是如何和父窗口进行交互的呢?
先来看window.showModalDialog的例子:
我这里现在有一个父窗体parent.jsp,它里面有一个方法
function openChild(){
var temp = window.showModalDialog("child.jsp",window,'dialogWidth=400px;dialogHeight=200px');
document.getElementById("fromChildName").value = temp.childName;
document.getElementById("fromChildAge").value = temp.childAge;
}
这里面,我们第二个参数传递为window,也就是把当前页面做为参数传递到子窗口中,temp 为子窗口的返回值
再来看子窗口child.jsp页面:
function fromParent(){
var parName = window.dialogArguments.document.getElementById("parName").value; //得到父窗口中的姓名
var parAge = window.dialogArguments.document.getElementById("parAge").value
document.getElementById("fromParName").value = parName;
document.getElementById("fromParAge").value = parAge;
}
从上面我们就可以看出,在父窗口中我们传递了window这个参数,然后在子窗口中,我们用window.dialogArguments直接到取了父窗口中id = "parName"的属性值
再来说这个返回值temp是怎么回事?
function toParent(){
var obj = new Object();
obj.childName = document.getElementById("childName").value;
obj.childAge = document.getElementById("childAge").value;
window.returnValue = obj;
window.close();
}
我们用window.returnValue的方式直接把一个对象返回到父窗口,然后父窗口根据对象中的属性直接取出其中的值就OK了
那么,我们可不可以直接调用父窗口中的方法呢?
答案是肯定的:
function fromParentFunction(){
window.dialogArguments.parFunction();
}
我们用window.dialogArguments + 父窗口的方法名,就直接可以调用父窗口的方法
上面是window.showModalDialog如何来进行子父窗口间的传递值,那么,接下来看下window.open是如何进行子父窗口间的传值:
在父窗口parent.jsp页面中:
function openChild(){
var obj = window;
obj.name = "张三";
obj.age = "18";
window.open('child.jsp','我是弹出子窗口','height=200,width=400,top=200,left=400,toolbar=no,menubar=no,
scrollbars=no, resizable=no,location=no, status=no');
}
我们定义变量obj = window,再通过属性赋值把对象传递过去,接下来看下子窗口:
function fromParent(){
alert("得到父窗口的中姓名值:"+ this.opener.name);
alert("得到父窗口中的年龄值:"+ this.opener.age);
}
利用this.opener.属性名 就可以得到父窗口中的变量值
那么如何把值子窗口中的值再返回到父窗口中呢?
function toParent(){
//把子窗口中的值传递给父窗口,document.getElementById("name").value得到子窗口的值
this.opener.document.getElementById("parName").value = document.getElementById("childName").value;
this.opener.document.getElementById("parrAge").value = document.getElementById("childAge").value;
window.close();
}
这里的parName是父窗口中的id = 'parName' ,也就是说,可以在子窗口中利用 this.opener. + 父窗口元素 赋值给父窗口
window.showModalDialog 与window.open传递参数的不同?的更多相关文章
- window.showModalDialog与window.open()使用
window.showModalDialog 有些浏览器不兼容,尝试用window.open() 封装替代,需要打开子窗口后向父窗口传递数据. <html> <script src= ...
- window.open、window.showModalDialog和window.showModelessDialog 的区别[转]
一.前言 要打开一个可以载入页面的子窗口有三种方法,分别是window.open.window.showModalDialog和window.showModelessDialog. open方法就是打 ...
- window.showModalDialog以及window.open用法简介
.可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象.例如:------------------------------parent.htm<script& ...
- window.showModalDialog的基本用法
window.showModalDialog的基本用法 showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.show ...
- window.showModalDialog
//新版本谷歌没有window.showModalDialog,创建一个window.openif(window.showModalDialog == undefined){ window.show ...
- window.showModalDialog()之返回值
window.showModalDialog的基本用法 showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.show ...
- window.open || window.showModalDialog || window.showModelessDialog
http://dwcmayday201204063551.iteye.com/blog/1621751 http://www.cnblogs.com/zhangyi85/archive/2009/09 ...
- javascript window.showModalDialog不兼容goole解决方案
window.showModalDialog不兼容goole解决方案 一.弹框方案: 1.window.open; 2.window.showModalDialog; 3.div制作窗口:(本节忽略) ...
- window.parent与window.opener、window.showModalDialog的区别 opener和showModalDialog刷新父页面的方法
项目中使用案例: 父窗体 <s:form namespace="/forexagent" id="listSearchForm" name="t ...
随机推荐
- cefSharp在XP下使得程序崩溃记录
前言:这是一个奇葩的问题,到现在自己还没有搞明白问题出现在哪里,但是从问题总算是解决了,希望看到此文章的大牛,如果知道问题出在什么地方,可以告知一下. [一个在XP系统下面应用程序崩溃问题] 资源: ...
- js 判断页面是否加载完成
javascript代码如下: document.onreadystatechange = subSomething; //当页面加载状态改变的时候执行这个方法 function subSomethi ...
- Office2013版的破解之路
追着潮流,我还是更新了我的所有软件,2013版早就下载了,因为一直破解的问题没有装,这次终于找到必成功的办法. 1.准备工作: 下载office2013的官方版即可,官方版里不包含project和vi ...
- Android APP的安装路径
转载自:http://blog.csdn.net/libaineu2004/article/details/25247711 一.安装路径在哪? Android应用安装涉及到如下几个目录: syste ...
- Java的平台无关性
转载自:http://www.cnblogs.com/Y/archive/2011/03/22/JavaVM_Learning_Chapter2_Platform_Independence.html ...
- 200 OK (from cache) 与 304 Not Modified
解释: 200 OK (from cache) 是浏览器没有跟服务器确认,直接用了浏览器缓存: 304 Not Modified 是浏览器和服务器多确认了一次缓存有效性,再用的缓存. 触发区别: 2 ...
- [WebService]之DTD
文档类型定义(DTD)可定义合法的XML文档构建模块.它使用一系列合法的元素来定义文档的结构. DTD 可被成行地声明于 XML 文档中,也可作为一个外部引用. <?xml version=& ...
- ipython, 一个 python 的交互式 shell,比默认的python shell 好用得多,支持变量自动补全,自动缩进,支持 bash shell 命令,内置了许多很有用的功能和函数
一个 python 的交互式 shell,比默认的python shell 好用得多,支持变量自动补全,自动缩进,支持 bash shell 命令,内置了许多很有用的功能和函数. 若用的是fish s ...
- U盘FAT32文件系统
一.FAT文件系统分为四个部分 参考别人的博客 1.http://blog.163.com/ourhappines@126/blog/static/121363154201311811495492/ ...
- raspbian重置密码
将树莓派上的SD连到电脑,修改cmdline.txt在文件的的最后添加init=/bin/sh dwc_otg.lpm_enable= console=ttyAMA0, kgdboc=ttyAMA0, ...