window.showModalDialog用法

今天把window.showModalDialog用法记录一下,下面说的父窗口和子窗口之间传值的问题

js代码片段:这是一个js的function

复制代码
function menuQuery(field1,field2,path) {
    var str = "";
    if (window.screen) {
        var ah = screen.availHeight - 20;
        var aw = screen.availWidth - 10;
        var xc = (aw - 50) / 2;
        var yc = (ah - 485) / 2;
        str += "dialogLeft:" + xc + ";";
        str += "dialogTop:" + yc + ";";
    }
    window.showModalDialog("system.menu.menuReadAction.do",window, "dialogHeight:450px;dialogWidth:200px;status=no;"+str);
}
复制代码

1.  str 字符串只是拼接了指定窗口位置的参数
2.  window.showModalDialog("system.menu.menuReadAction.do",window,"dialogHeight:45px;dialogWidth:200px;status=no;"+str);

    本句的意思是打开一个子窗口, 在showModalDialog中传了3个参数:

  第一个参数 指定 页面跳转的地址,第二个参数是window,可以把父窗口对象传给子页面,第三个参数是控制子窗口的显示位置

 

jsp代码片段:

复制代码
<td align="left" width="70%">
   <input type=text id="parentMenuName" value="<s:property value="#request.parentMenu"/>" readonly />
    <input type="hidden" id="mnId" name="pMnId" value="<s:property value='menu.parentMenu.mnId'/>" />
    <s:fielderror fieldName="menu.mnName" />
    <input type="button" value="选择" id="chose" onclick="menuQuery(mnId,parentMenuName);">
</td>
复制代码

在jsp代码中onclick="menuQuery(mnId,parentMenuName)"用来调用上面js的function

在打开的子窗口中,有如下js脚本

复制代码
<script>
var val=window.dialogArguments.document.getElementById("parentMenuName");
      var val2=window.dialogArguments.document.getElementById("mnId");
      val.value="部门";
      val2.value="0102999";
      window.close()
</script>
复制代码

在子窗口中就可以通过window.dialogArguments获取父窗口对象,
通过window.dialogArguments.document.getElementById("parentMenuName")来获取父窗口中的id为parentMenuName的dom对象

通过window.dialogArguments.document.getElementById("mnId");来获取父窗口中的id为mnId的dom对象

再通过下面的语句,就可以在子窗口的js代码中为父窗口中的dom元素赋值

val.value="部门";

val2.vlue="0102999"

最后通过window.close();关掉子窗口

 

posted @ 2016-02-26 10:04  meridabike  阅读(337)  评论(0编辑  收藏  举报