简单的说,就是一个在弹出窗口之后可以做其它的事,即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传递参数的不同?的更多相关文章

  1. window.showModalDialog与window.open()使用

    window.showModalDialog 有些浏览器不兼容,尝试用window.open() 封装替代,需要打开子窗口后向父窗口传递数据. <html> <script src= ...

  2. window.open、window.showModalDialog和window.showModelessDialog 的区别[转]

    一.前言 要打开一个可以载入页面的子窗口有三种方法,分别是window.open.window.showModalDialog和window.showModelessDialog. open方法就是打 ...

  3. window.showModalDialog以及window.open用法简介

    .可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象.例如:------------------------------parent.htm<script& ...

  4. window.showModalDialog的基本用法

    window.showModalDialog的基本用法 showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.show ...

  5. window.showModalDialog

    //新版本谷歌没有window.showModalDialog,创建一个window.openif(window.showModalDialog == undefined){  window.show ...

  6. window.showModalDialog()之返回值

    window.showModalDialog的基本用法 showModalDialog() (IE 4+ 支持) showModelessDialog() (IE 5+ 支持) window.show ...

  7. window.open || window.showModalDialog || window.showModelessDialog

    http://dwcmayday201204063551.iteye.com/blog/1621751 http://www.cnblogs.com/zhangyi85/archive/2009/09 ...

  8. javascript window.showModalDialog不兼容goole解决方案

    window.showModalDialog不兼容goole解决方案 一.弹框方案: 1.window.open; 2.window.showModalDialog; 3.div制作窗口:(本节忽略) ...

  9. window.parent与window.opener、window.showModalDialog的区别 opener和showModalDialog刷新父页面的方法

    项目中使用案例: 父窗体 <s:form namespace="/forexagent" id="listSearchForm" name="t ...

随机推荐

  1. Linux 通过YUM安装rzsz

    yum自动安装: yum install lrzsz

  2. 笔记:C语言数据类型在32位与64位机器上的字节数

    读<深入理解计算机系统> 第二章 信息的表示与处理 32位与64位的典型值,单位字节 声明 32位机器 64位机器 char 1 1 short int int 4 4 long int ...

  3. Inverse是hibernate双向关系中的基本概念。inverse的真正作用就是指定由哪一方来维护之间的关联关系。当一方中指定了“inverse=false”(默认),那么那一方就有责任负责之间的关联关系,说白了就是hibernate如何生成Sql来维护关联的记录

    <set name ='students' table="students_table" inverse='false'(默认不用写) > <key column ...

  4. 原生JS取代一些JQuery方法

    1.选取元素 // jQuery var els = $('.el'); // Native var els = document.querySelectorAll('.el'); // Shorth ...

  5. tableView 显示区域偏移

    在SB拖了一个tableView , 在显示的时候显示区域和tableView的区域不一致, (UITableViewWrapperView 和 UITableView frame不一致) 在SB上看 ...

  6. 查看MySql中每个IP的连接数

    要统计数据库的连接数,我们通常情况下是统计总数,没有细分到每个IP上.现在要监控每个IP的连接数,实现方式如下: ) as ip , count(*) from information_schema. ...

  7. 判定元素正在插入到DOM树——DOMNodeInsertedIntoDocument

    在firefox, webkit中我们可以使用DOMNodeInsertedIntoDocument事件,但这个事件很快变废弃了,虽然浏览器还是很有节操地支持它们,但哪一天不在也很难说.比如说fire ...

  8. Python基础-函数(function)

    这里我们看看Python中函数定义的语法,函数的局部变量,函数的参数,Python中函数的形参可以有默认值,参数的传递是赋值操作,在函数调用时,可以对实参进行打包和解包  1,函数定义 关键字def引 ...

  9. CodeForces 711C Coloring Trees (DP)

    题意:给定n棵树,其中有一些已经涂了颜色,然后让你把没有涂色的树涂色使得所有的树能够恰好分成k组,让你求最少的花费是多少. 析:这是一个DP题,dp[i][j][k]表示第 i 棵树涂第 j 种颜色恰 ...

  10. HDU 3364 Lanterns (高斯消元)

    题意:有n个灯和m个开关,每个开关控制数个灯的状态改变,给出k条询问,问使灯的状态变为询问中的状态有多少种发法. 析:同余高斯消元法,模板题,将每个开关控制每个灯列成行列式,最终状态是结果列,同余高斯 ...