ie 11 打印 iframe 404 降级解决方案

为什么80%的码农都做不了架构师？>>>   

问题描述：

公司项目遇到一个小难题，需要在iframe页面里打印一个详情展示层，在谷歌，火狐调用window.print()都没有问题，但在实际操作中ie11打印出的内容会报404找不到地址的错误。翻墙搜罗了一下，仿佛是微软的一个bug，目前微软团队已发布了更新（https://support.microsoft.com/en-us/help/4021558/cumulative-security-update-for-internet-explorer-june-13-2017）（https://support.microsoft.com/en-us/help/4032782/a-blank-page-or-404-error-prints-when-you-try-to-print-a-frame-in-ie），但因涉及到安全性问题，老大不让这么解决，并提供了如下解决方案。

解决思路：

一、判断浏览器是否是ie浏览器，如果不是就调用window.print()，如果是则新开一个窗口，将需要打印的内容传入新开的页面。

二、在新开的页面重新调用window.print()即可解决此问题

重点代码如下：

 if (!!window.ActiveXObject || "ActiveXObject" in window) {
        //IE，使用showModalDialog方法打开打印

        var winHight = (window.screen ? screen.availHeight : 700) - 300;//屏幕高 不包括任务栏 -100为了上下方留空居中
        winWidth = 800;//screen.availWidth;//屏幕宽 不包括任务栏
        var pra = $('#eventDetailModal').html();   //传入打印页面的内容
        //returnValue:返回值,这里不需要返回值，仅为了保持父页面禁止
        var returnValue = window.showModalDialog(
            '/web/admin/testPrint.html',
            { html: pra },
            'dialogHeight:' + winHight + 'px;dialogWidth:' + winWidth + 'px;center:yes;status:no;'
        );
        /*
            window.showModalDialog的说明：http://blog.csdn.net/bobwu/article/details/7474703
        */
        //打印窗口关闭后回传的参数
        //alert(returnValue);
    } else {
        //其他浏览器，正常打印
        window.print();
    }

另有一个打印页面testPrint.html用来接收数据及实现ie下打印，它的重点代码如下：

 $(function () {
        var Param = window.dialogArguments;
        if (!Param || !Param.html) {
            //没有获取到详情编号，关闭当前窗口
            alert('没有获取到详情信息，请刷新后重试');
            self.close(); 
        }
        $('body').append(Param.html);     

        //打印本页面
        $('#print').click(function () {        
            window.print();
        });
        //关闭本页面
        $('#closePage').click(function () {
            self.close(); 
        });
    });    

附：

这种解决方法增加了页面复杂度和用户操作，总感觉不太好，希望不久会有更好的解决方案出现。

转载于:https://my.oschina.net/cpWeb/blog/1475277