模态視窗 showModalDialog 浏覽器相容解決方案

無意中遇到一個老項目，遇到showModalDialog在谷歌火狐浏覽器失效的問題，查了一下官方文檔，發現已經廢棄。

電腦端	移動端
Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Edge Mobile	Firefox for Android	Opera for Android	iOS Safari
基本支援 （棄用）	不支援	不支援	不支援	支援：4	不支援	支援	不支援	不支援	不支援	不支援	不支援	不支援

馬上發現了教程，很順利的解決了。記錄下來大家參考。方法如下：

/**
 * showModalDialog相容處理
 * 該特性已從Web标準中删除
 * @author 範圍兄 <[email protected]>
 */
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;
    };
}
           

贊一個！

本文系轉載内容，如有問題請聯系原創[機智]

原文連結：https://blog.csdn.net/ambit_tsai/article/details/80633290