Chrome不支持showModalDialog模态对话框和无法返回returnValue的问题

本文详细解析了Chrome浏览器下showModalDialog方法的行为表现及与window.open方法的相似性,包括如何通过window.opener实现类似returnValue的功能,以及在不同浏览器中使用该方法时的差异性,特别是针对子窗体的window.opener和window.dialogArguments的测试结果。

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

在chrome浏览器下showModalDialog方法显示的并不是模态对话框,就像新打开一个页面一样,父窗口仍然可以随意获取焦点,并可以打开多个窗体,而且返回值returnValue也无法返回,一直是undefined。这么多问题很令人头疼,下面就各个主流最新版的浏览器进行了一下测试。

浏览器 是否支持 状态
IE9  
Firefox13.0  
safari5.1  
chrome19.0 × 并不是模态对话框,而是open了一个新窗体
Opera12.0 × 什么也发生,连个窗体都不弹

Chrome到底打开的是什么

因为打开的不是模态对话框,而是像open了一个新窗体一样,那只要验证一下子窗体window.opener是否为空就明白了。

[javascript] view plain copy print ?
  1. <script type="text/javascript">
  2. alert(window.opener);
  3. </script>
<script type="text/javascript">
        alert(window.opener);
</script>

在chrome中,显示的是一个[object window]对象,而IE则是undefined。现在知道原来chrome将showModalDialog当作window.open来处理了。也就是说我们完全可以用window.opener来操作chrome浏览器下子窗体。这里还发现个很有趣的现象,firefox中测试window.opener也并不为空,于是我又测试了下使用showModalDialog在子窗体中关于window.opener和window.dialogArguments在各个浏览器里的状况,由于Opera浏览器连个窗体都不弹,下面测试就剔除它了。

说明下父窗体的showModalDialog的方法中arguments传递是window对象,下面是测试的结果:

浏览器 模态对话框 window.opener window.dialogArguments returnValue
IE9 undefined [object Window]
Firefox13.0 [objectWindow] [object Window]
safari5.1 [objectWindow] [object Window]
chrome19.0 × [objectWindow] undefined ×

以上是我测试的结果,各个浏览器所支持的程度还是不一样的。还要说一下Firefox浏览器下,子窗体假如刷新的话window.dialogArguments照样会丢失,变成undefined。以上结果中我们可以看出返回值returnValue就只有chrome浏览器返回的是undefined,其他浏览器都没有问题。那该如何解决这个问题呢?

解决returnValue问题

通过以上的种种测试,我们已经知道chrome的showModalDialog方法很像执行了window.open方法,那么我们可以利用window.opener来实现window.returnValue的功能。

父窗体部分js代码:

[javascript] view plain copy print ?
  1. var returnValue = window.showModalDialog("son.html ", window);
  2. //for chrome
  3. if (returnValue == undefined) {
  4. returnValue = window.returnValue;
  5. }
var returnValue = window.showModalDialog("son.html ", window);
//for chrome
if (returnValue == undefined) {
    returnValue = window.returnValue;
}

子窗体部分js代码:

[javascript] view plain copy print ?
  1. if (window.opener != undefined) {
  2. //for chrome
  3. window.opener.returnValue = "opener returnValue";
  4. }
  5. else {
  6. window.returnValue = "window returnValue";
  7. }
  8. window.close();
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值