IE浏览器showModelDialog()模态窗口常规操作

最新推荐文章于 2021-01-11 21:13:12 发布

代码艺术

最新推荐文章于 2021-01-11 21:13:12 发布

阅读量3.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： java 文章标签：浏览器 url 根据新URL刷新当前模式对话框 js window.showModelDial

本文链接：https://blog.youkuaiyun.com/u013919201/article/details/43194715

java 专栏收录该内容

28 篇文章

订阅专栏

本文介绍了在IE浏览器中使用showModalDialog()方法创建模态窗口的常见问题及解决方案，包括如何避免在打开新模态窗口时打开新页面。详细讲解了模态窗口的特点、方法、参数说明、参数传递以及实例代码，特别是如何处理查询和传参，以及通过返回值更新父窗口内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一般业务功能

当业务需要在模态窗口上执行一些操作，如一般的增删改查，当用到分页控件的时候，如page-tiglib时在<head> 标签里加了<base target="_self"/> ，在执行分页操作时都不会出现内容在新的窗口打开的情况，但当我们用来做查询的时候，或是想根据需要想要更新当前页面的URL地址并刷新的时候，这个时候就会就会出现我们更新后的内容在新的窗口或页面打开，这个问题在我做开发的时候困扰了很久，总是在想为何老是在新的页面打开，在网上查询了很多资料也都没有类似的情况，具体的说应该没有和我现在做的这个功能类似，就比如查询功能来说，当我们取得当前页面的url地址并在末尾加上查询条件时，一般还会加个随机数防止浏览器读缓存，无论使用了多久也都失败了，后来突然灵光一现，不是有参数返回么，我可以通过参数返回将url地址返回给主窗口并关闭当前模态窗口，让主窗口重新重新打开模态窗口，如果根据操作返回的参数可能有不同的判断，可以采取数组的方式存操作参数并传入相应的值

下面是我用来处理查询和传参的代码，

父页面：js

Var addnewreserds=window.showModalDialog(ur,window,"dialogWidth:820px;dialogHeight:650px;status:no;help:no;");//创建子模态窗口

//处理子窗口返回值

if(addnewreserds) {

Recur(addnewreserds);//当addnewreserds不是undefined时调用Recur()

}

functionRecur(addnewreserds){

//当addnewreserds第一个参数满足查询操作时执行递归

if(addnewreserds[0] == "opr") {

varaddnewreserds=window.showModalDialog(addnewreserds[1],window,"dialogWidth:820px;dialogHeight:650px;status:no;help:no;");

Recur(addnewreserds);

}

///当addnewreserds第一个参数满足返回值操作时传值并结束

if(addnewreserds[0] == "parmt") {

document.getElementById("pollutantId").value=addnewreserds[1];

return ;

}

一、最大特点：模态窗口与非模态窗口

模态窗口：当该窗口弹出时焦点一直停留在该弹出窗上，只有当前窗口关闭才能操作父窗口。

非模态窗口：既相对于模态窗口而言，焦点并未一直处于当前窗口，父窗口任然处于可被获取焦点。

二、方法介绍

Ie4以上支持: window.showModelDialog(); 创建一个html内容模态对话框

Ie5以上支持： window.showModelessDialog(); 创建一个html内容非模态对话框

三、参数说明

以window.showModelDialog(SonUrl,[,var],[,sfirl])共有三个参数，与showModelessDialog一样。

SonUrl：字符类型，为子窗口的URL地址。

Var：泛型，可以向子窗口传递任何参数，类型不限，如数组等

Sfirl：字符类型，描述窗口外观信息，属性与值之间用”:”相隔,属性与属性之间用‘;’支持属性有如下：

dialogHeight :100px ie4中设置为em结尾设置窗口高度

dialogWidth :100px 设置窗口宽度

dialogLeft 距离桌面左的距离

dialogTop 距离桌面上的距离

center : {yes|no|0|1} 是否居中默认yes

help: {yes|no|0|1} 是否显示帮助按钮，默认yes

resizable: {yes|no|0|1} IE5以上支持，是否可改变大小，默认no

status: {yes|no|0|1}是否显示状态栏，默认为no

scroll：{yes|no|0|1} 是否显示滚动条，默认为yes

以下几种属性一般用在HTA(HTML应用程序中)一般网页不使用

dialogHide:{yes|no|0|1|on|off} 在打印或打印预览时是否显示对话框，默认为no

edge：{ sunken | raised}：指明对话框的边框样式。默认为raised。

unadorned:{yes | no | 1 | 0 | on | off }：默认为no。

四、参数传递

父 ---à 子

以window.showModelDialog(SonUrl,[,var],[,sfirl])创建新模态窗口时，第二个参数就为传递参数，

例：

父窗口 js：

Varsome = ‘123’;

Window.showModelDialog(‘子窗口url’, some);

子窗口 js：

Vara= window.dialogArguments;

Alert(a);

//子窗口通过window.dialogArguments取父窗口传递的值，变量a具体为什么类型就看父窗口传递的参数是什么类型，如果是对象，可以通过bean 打点调用里面的属性，如果是多个对象或参数可以通过数组的方式转变为一个参数进行传递

子----à 父

通过 window.returnvalued=参数进行子窗口返回数据到父窗口，需要注意的是，当父窗口执行window.showModelDialog语句后会暂停执行下一条语句，等待子模态窗口关闭后才会继续执行下一条语句，所以如果子窗口有返回数据时可以直接在showModelDialog吓一条语句处理返回数据，当然要考虑到参数为undefined之类的情况，当子窗口返回数据的，只有当前子窗口关闭时数据才会返回到父窗口，

例：

父：js

Window.showModelDialog(‘url’);

For(inti=0 ; I = a.length;i++){

Alert(a[i]);

}

子：js

Vara={‘a’,’b’,’c’ };

Window.returnvalue(a);

Window.close();