谷歌浏览器Chrome不再支持showModalDialog的解决办法

问题重现

弹出窗口编码:

JavaScript

0

1

2

3

4

5

6

7

var obj = new Object();

var retval = window.showModalDialog("request.aspx",obj,"dialogWidth=500px;dialogHeight=300px");

if (retval == null) {

...

}else {

...

}

浏览器异常:

Shell

0

1

Uncaught TypeError: undefined is not a function

如果出现这个异常,很不幸你已经躺枪了。关于这个问题可以看这里:

http://windowsitpro.com/blog/google-kills-showmodaldialog-api-chrome-37-and-does-evil-exchange-owa

http://www.infoq.com/news/2014/09/chrome-showmodaldialog

其中有些临时解决办法,但貌似showModalDialog不会回来了。

问题解决

常见的弹出窗口有div模拟或者用window.open代替,对于一个已经在用的系统来说,采用div方式转换成本较高,采用window.open改动会更少一些,但也会丢失其模态性。

这里采用简单的window.open方案,毕竟替换成本低很多。针对上文中提到的showModalDialog使用方式,替换为:

0

1

2

3

4

5

var iWidth = 500;

var iHeight = 300;

var iTop = (window.screen.availHeight - 30 - iHeight) / 2;

var iLeft = (window.screen.availWidth - 10 - iWidth) / 2;

var win = window.open("request.aspx", "弹出窗口", "width=" + iWidth + ", height=" + iHeight + ",top=" + iTop + ",left=" + iLeft + ",toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no,alwaysRaised=yes,depended=yes");

采用这种方式就可以打开一个和之前使用showModalDialog差不多的窗口。但是怎么返回值呢?

在弹出页面中有两种方式:

1、直接设置父窗口的DOM对象的值。

0

1

window.opener.document.getElementById(“parentWindowControlId”).value = "数据";

父窗口中应该有一个id为parentWindowControllId的DOM元素。

2、调用父窗口中的Javascript函数,由父窗口进行相应的处理。

0

1

2

3

4

5

var obj = {

id:"id",

name:"name"

};

window.opener.DoAfterXXX(obj);

父窗口提供一个DoAfterXXX的函数就可以了。

长远来看window.open由于其用户体验问题必将走向没落,大家还是尽快转移为好。

转自波斯马 原文地址《谷歌浏览器Chrome不再支持showModalDialog的解决办法

时间: 2024-12-19 15:50:44

谷歌浏览器Chrome不再支持showModalDialog的解决办法的相关文章

php中curl不支持https的解决办法

在php程序中使用curl去访问https站点时,报错:Protocol https not supported or disabled in libcurl 该错误信息表示php当时编译时使用的curl库不支持https, 验证方法为你的curl安装目录/bin/curl  -V  显示如下:Protocols: dict file ftp gopher http imap pop3 rtsp smtp telnet tftp这表示curl是不支持 https的 为了支持https,需要下载源

使用的 SQL Server 版本不支持数据类型“datetime2”解决办法

错误原因,在使用ado.net entity的时候,entity使用的数据库是sqlserver 2008,但后来实际使用中使用的数据库是sqlserver 2005 使用的 SQL Server 版本不支持数据类型“datetime2” The version of SQL Server in use does not support datatype ‘datetime2 解决办法 Open your EDMX in a file editor (or “open with…” in Vis

让IE完美支持HTML5(css3)解决办法

貌似以前与大家分享过此类问题,HTML5/CSS3那些炫丽实用的效果,真得让人很眼谗,但悲催的IE浏览器,只有IE9才支持HTML5,这让我们很失望啊,但真的就没有一点办法了吗?其实补救方法还是有的,下面介绍的几种方法,可让客户端浏览器完美支持CSS3.HTML5: 第一种方法:IE9以下版本的IE将创建HTML5标签, 非IE浏览器会忽略这段代码,因此不会发生http请求,也就不影响网页执行效率. <!--[if lt IE9]> <script> (function() { i

新版本火狐 ,Chrome不支持showModalDialog解决办法

平常的网站中,有时我们会希望使用者按下按钮后开启一个保持在原窗口前方的子窗口,在IE中,我们可以使用showModalDialog来达成,但是chrome早就不支持showModalDialog,最近我的火狐也不支持了,所以就去网上找了下解决办法,与大家共享: 原来代码是这样: function showDialog(url, w, h){ showModalDialog(url, self, 'dialogWidth='+w+'px;dialogHeight='+h+'px');} 然后为了兼

chrome浏览器font-size&lt;12px无效解决办法

当样式设定font-size<12px时,chrome浏览器里字体显示仍为12px:如font-size:11px; 但是chrome还是12px的大小,很不听话. 今天我就遇到了这样的问题?网站产品分类块字体在IE9和FF下显示不正常,比预想的要小,在IE7\IE8\360\chrome里显示正常,我查了些资料就是没找到原因,问了网友才得到解决办法. -webkit-text-size-adjust 1.当样式表里font-size<12px时,中文版chrome浏览器里字体显示仍为12px

ie8不支持currentTarget的解决办法

一般绑定事件时,我们都会在事件回调方法里用event.currentTarget获取当前对象,但到ie8里就获取不到了. 解决方法如下: var eve = event || window.event; //获取事件对象var objEle = eve.target || eve.srcElement; //获取document 对象的引用 event 对象常用属性和方法(W3C规范) 属性 描述 IE 非IE W3C altKey 返回当事件被触发时,"ALT" 是否被按下. Yes

谷歌浏览器 Chrome 遇到Flash崩溃的处理办法

安装谷歌浏览器之后经常遇到Flash崩溃或者浏览器在浏览Flash内容时卡死的情况.在网上查找资料大多都认为应该是浏览器自带的Flash插件工作模式引起的问题,解决方法如下: 首先在地址栏输入chrome://plugins/显示浏览器使用的插件. 点击右上角的详细信息,可以看到Flash插件为进程外插件. 点击停用,停用掉浏览器自带的Flash插件,然后打开http://get.adobe.com/cn/flashplayer 根据提示下载插件安装Chrom专门的控件即可. 经测试,再也没出现

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

父窗体部分js代码: 1 var returnValue = window.showModalDialog("son.html ", window); 2 //for chrome 3 if (returnValue == undefined) { 4 returnValue = window.returnValue; 5 } 子窗体部分js代码: if (window.opener != undefined) { //for chrome window.opener.returnVa

ie不支持getElementsByClassName的解决办法

目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管:如果不支持,就在document对象里加入getElementsByClassName这个方法,按兴趣的朋友可以了解下 if (navigator.appName == 'Microsoft Internet Explorer') { document.getElementsByClassName = function() { var tTagName = "*"; if (arguments.length > 1)