showModalDailog 兼容

需求

在很久很久以前的代码上，使用了showModalDailog来实现模态窗体。突然老大发现网站只在ie上好使了，就让排查问题，结果一看，除了ie，其他大佬好像都不支持这玩意了，满满的绝望，需求来了：在尽量不动源代码的基础上实现其他浏览器的兼容

解决方案

先搜索

Chrome浏览器showModalDialog兼容性及解决方案

ShowModalDialog Polyfill这个是搜了很久很久才在一篇不是太起眼的blog中发现的，博主也是搜了半天，后来FQ上了谷歌，才发现其实早就有人实现了这个兼容了。也是一番感叹。原谅我忘了博客地址了，只记得收藏方案了。

后来，用了第二种方式来实现兼容，在过程中也遇到了一些问题，主要的就是回调
因为项目太老 回调就只能用eval了
看一眼，相关代码，这就意味着 对原调用方法的书写就有一定要求，这个改了很久，这个就得具体情况具体分析了，不多说了、

相关代码：

//if using eval
        var isNext = false;
        var nextStmts = caller.split('\n').filter(function(stmt) {
            if(isNext || stmt.indexOf('showModalDialog(') >= 0)
                return isNext = true;
            return false;
        });
        dialog.addEventListener('close', function() {
            var returnValue = document.getElementById('dialog-body').contentWindow.returnValue;
            document.body.removeChild(dialog);
            nextStmts[0] = nextStmts[0].replace(/(window\.)?showModalDialog\(.*\)/g, JSON.stringify(returnValue));
            eval('{\n' + nextStmts.join('\n'));
});

转载于:https://www.cnblogs.com/prayol/p/8507971.html