Chrome不支持showModalDialog模态对话框和无法返回returnValue的问题
为大家提供Chrome不支持showModalDialog模态对话框和无法返回returnValue的解决方法
IE9 ○
Firefox13.0 ○
safari5.1 ○
chrome19.0 × 并不是模态对话框,而是open了一个新窗体
Opera12.0 × 什么也发生,连个窗体都不弹
Chrome到底打开的是什么因为打开的不是模态对话框,而是像open了一个新窗体一样,那只要验证一下子窗体window.opener是否为空就明白了。
<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 ○ [object Window] [object Window] ○
safari5.1 ○ [object Window] [object Window] ○
chrome19.0 × [object Window] undefined ×
以上是我测试的结果,各个浏览器所支持的程度还是不一样的。还要说一下Firefox浏览器下,子窗体假如刷新的话window.dialogArguments照样会丢失,变成undefined。以上结果中我们可以看出返回值returnValue就只有chrome浏览器返回的是undefined,其他浏览器都没有问题。那该如何解决这个问题呢?解决returnValue问题
通过以上的种种测试,我们已经知道chrome的showModalDialog方法很像执行了window.open方法,那么我们可以利用window.opener来实现window.returnValue的功能。
注意:temp=Math.random()这个随机参数是为了解决缓存问题,不少朋友测试出undefined是因为是缓存的问题。 追加于2012-10-17
父窗体部分js代码:
window.onload = function () {
var returnValue = window.showModalDialog("son.html?temp=" + Math.random(), window);
//for chrome
if (returnValue == undefined) {
returnValue = window.returnValue;
}alert(returnValue);
}
子窗体部分js代码:
if (window.opener != undefined) {
//for chrome
window.opener.returnValue = "opener returnValue zhaoxi.net";
}
else {
window.returnValue = "window returnValue zhaoxi.org";
}
window.close();这样也在IE,FireFox,Chrome,Safari等浏览器下都可以通用了。