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("pa rName").value;  //得到父窗口中的姓名
  var parAge = window.dialogArguments.document.getElementById("pa rAge").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=n o,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").val ue = document.getElementById("childName").value;
  this.opener.document.getElementById("parrAge").val ue = document.getElementById("childAge").value;
  window.close();
  }
  这里的parName是父窗口中的id = 'parName' ,也就是说,可以在子窗口中利用 this.opener. + 父窗口元素 赋值给父窗口

你可能感兴趣的:(window.showModalDialog 与window.open传递参数的不同?)