模态窗口showModalDialog的浏览器兼容解决方案【改】

将代码中原来的

window.showModalDialog

全部替换成:

showModalDialogN

然后增加方法:

    function showModalDialogN(uri, args, opts){
        if(!window.showModalDialog){
            showModalDialogN = function(uri, args, opts){
                opts = opts.replace(/:/g, '=')
                    .replace(/;/g, ',')
                    .replace('dialogWidth', 'width')
                    .replace('dialogHeight', 'height')
                    .replace('dialogtop', 'top')
                    .replace('dialogleft', 'left')
                    .replace('scroll', 'scrollbars');
                window.open(uri, '', opts).dialogArguments = args;
            };
        }else{
            window.showModalDialog(uri, args, opts);
        }
    }

 

 

参考:

模态窗口showModalDialog的浏览器兼容解决方案

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/ambit_tsai/article/details/80633290

博主遇到一个项目,拿以前的项目来改的,它所用框架的版本官方已经停止维护很多年了,而且以前项目遗留的代码那是“一言难尽”啊。
用chrome调试的时候,点击一个按钮毫无反应,控制台提示showModalDialog不存在。网上查了下,在MDN Web文档找到了温馨提示:

已废弃
该特性已经从 Web 标准中删除,虽然一些浏览器目前仍然支持它,但也许会在未来的某个时间停止支持,请尽量不要使用该特性。

  • “改是不可能改的,这辈子不可能改的” — 窃·格瓦拉

在博主看来,这种老爷车还是不要大修的好,于是自己动手进行兼容,如下借助window.open对它的行为进行模拟。

/**
 * showModalDialog兼容处理
 * 该特性已从Web标准中删除
 * @author 范围兄 <ambit_tsai@qq.com>
 */
if(!window.showModalDialog){
    window.showModalDialog = function(uri, args, opts){
        opts = opts.replace(/:/g, '=')
            .replace(/;/g, ',')
            .replace('dialogWidth', 'width')
            .replace('dialogHeight', 'height')
            .replace('dialogtop', 'top')
            .replace('dialogleft', 'left')
            .replace('scroll', 'scrollbars');
        window.open(uri, '', opts).dialogArguments = args;
    };
}
posted @ 2019-12-09 10:22  戈博折刀  阅读(1052)  评论(0编辑  收藏  举报