4

我有一个打印按钮，可以在任何网页上启动打印功能。一旦用户单击该按钮，该按钮就会隐藏，并显示用户是否已完成打印或在打印窗口中按下关闭。它在 Chrome 中运行良好，但在 Firefox 和 IE 中失败。

<input type="button" onclick="launchPrint()" value= "Print me" />


function launchPrint(){
$(".print-box").hide();
window.print();
}

(function() {
    if (window.matchMedia) {
        var mediaQueryList = window.matchMedia('print');
        mediaQueryList.addListener(function(mql) {
            if (!mql.matches) {
                $(".print-box").show();
            }
        });
    }
}());

有什么建议我可能会错过吗？

4

2 回答 2

1

不幸的是，我和你有同样的问题，我做了一些研究。目前看来，最新版本的 FF 和 IE 上仍然存在该错误，并且尚未修复。

您可以查看 Firefox 的此错误：https ://bugzilla.mozilla.org/show_bug.cgi?id=774398

我发现另一个人和我们有同样的问题，但答案并不令人满意： https ://social.technet.microsoft.com/Forums/office/en-US/bc3ca05e-b4ef-425b-8bbd-d3f700a8c85e/ windowmatchmedia-not-firing-for-print-in-ie?forum=ieitprocurrentver

如果我遇到任何解决方案，我将对此进行编辑。

我主要使用与您相同的代码作为 highchart 在打印前调整大小的示例：

function printUpdate() {
    jQuery.each(Highcharts.charts, function(index, value){
        value.reflow();
    });
};
var mediaQueryList = window.matchMedia('print');
if(navigator.appVersion.indexOf("MSIE 8.")!==-1)//For IE8
{
    document.attachEvent(function (mql){printUpdate();}, mediaQueryList);
}
else
{
    if (window.matchMedia) {
        mediaQueryList.addListener(function (mql) {
            if (mql.matches)
            {
                printUpdate();
            }
        });
    }
}

window.onbeforeprint = printUpdate;

这在 chrome 中工作正常。但 FF 和 IE11 不会触发该事件。

于 2016-09-23T13:49:38.363 回答
0

您可能想查看onafterprint事件。至少这是由 Firefox 和 IE 触发的，因此对于您的用例，使用潜在的警卫（以确保事件不会多次触发）您可以同时收听 thematchMedia("print")和onafterprintevent。

于 2016-11-25T14:57:02.227 回答