js中window.open和showModalDialog的区别

最新推荐文章于 2019-07-02 22:19:53 发布

舟之桥

最新推荐文章于 2019-07-02 22:19:53 发布

阅读量1.8k

点赞数

分类专栏：专业知识

专业知识专栏收录该内容

10 篇文章 0 订阅

订阅专栏

转载地址：http://www.jb51.net/article/32590.htm

在JS中打开新窗口一直在用open()，showModalDialog()几乎已被遗忘，showModalDialog和open一样也是3个参数，showModalDialog(文件地址,window,窗口属性)，open(文件地址,window,窗口属性)。

1. open打开的新窗口标题栏上可以看到最小化最大化按钮，而showModalDialog默认是没有的，只有一个小叉叉

2. open打开的新窗口可以鼠标可以点击父窗口的，showModalDialog只有把新打开的窗口关了鼠标的焦点才可触到父窗口(从某种程度上来说它就是个对话框)！

3. showModalDialog窗口属性的参数和open的窗口属性是有所区别的

a. open的窗口高度写法在此就不写了因为它和HTML代码的属性写法一样，下面看看showModalDialog的写法

b. open('http://hi.baidu.com/yp2010','window','width=100,height=100,..')
var v=showModalDialog('http://hi.baidu.com/yp2010',window,"dialogWidth:800px;dialogHeight:600px;center:yes;edge:raised ;scroll:yes;status:no;")

从上述代码可以看出showModalDialog有返回值。
dialogWidth:宽，dialogHeight:高，center:窗口位置，edge:边框样式，滚动条，状态栏minimize:yes;maximize:yes;最小化最大化按钮。。

4. window.dialogArguments 可调用父窗口的方法
5. window.returnValue 传回父窗口的参数

要打开一个类似对话框的窗口就可用showModalDialog方法。
注：没有特别的要求下建议用open，用showModalDialog的话可能会遇到一些问题。

6. 在模态窗口里form 提交会弹出新窗口，这个问题简单就在<head>里面加个<base target="_self"> 就可以搞定，

注：我刚开始是不想通过form提交的，用js window.location.href 跳转到不同的action去处理，发现
<base target="_self"> 就不起作用了，似乎 <base target="_self"> 只是针对form action="" 才起作用，这个地方应该可以用iframe 去实现。

7. 在A页面调用 window.open 打开窗口，代码会继续向下执行，而用 showModalDialog则会等到打开的新窗口关闭才会继续向下执行

例如：在A页面中有这样的代码：

openWin(url, "viewNotice",null,800,600);
openModalDialog(url, "viewNotice",null,800,600);
alert(1111);

如果用 open则会在打开新窗口后执行下面的代码alert(1111);，而showModalDialog则会等到打开的新窗口关闭才会执行 alert(1111);