检测浏览器打印事件

Question

是否可以检测用户何时从浏览器打印某些内容？

让事情变得复杂的是，如果我们在新窗口中向用户呈现 PDF 文档，是否可以检测到该文档的打印（假设用户从浏览器窗口打印它）？

我能找到的最接近的是我们是否实现自定义打印功能（类似于this）并跟踪何时调用该功能

我主要对适用于 Internet Explorer（6 或更高版本）的解决方案感兴趣

Answer 1

您现在可以使用以下技术在 IE 5+、Firefox 6+、Chrome 9+ 和 Safari 5+ 中检测打印请求：

(function() {
    var beforePrint = function() {
        console.log('Functionality to run before printing.');
    };
    var afterPrint = function() {
        console.log('Functionality to run after printing');
    };

    if (window.matchMedia) {
        var mediaQueryList = window.matchMedia('print');
        mediaQueryList.addListener(function(mql) {
            if (mql.matches) {
                beforePrint();
            } else {
                afterPrint();
            }
        });
    }

    window.onbeforeprint = beforePrint;
    window.onafterprint = afterPrint;
}());

我更详细地了解了它的作用和用途：http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/。

Answer 2

对于 Internet Explorer，有事件

window.onbeforeprint

 和 

window.onafterprint

，但它们不适用于任何其他浏览器，因此它们通常毫无用处。

由于某种原因，它们的工作方式似乎完全相同，都在打印窗口打开之前执行事件处理程序。

但是，如果您仍然想要它，尽管有这些警告，这里有一个例子：

window.onbeforeprint = function() {
    alert("Printing shall commence!");
}

Answer 3

对于 2020 年阅读本文的任何人。

addListener

 函数大多已被弃用，取而代之的是 

addEventListener

（Safari 除外）：

if (window.matchMedia) {
  const media = window.matchMedia("print");
  const myFunc = mediaQueryList => {
    if (mediaQueryList.matches) {
      doStuff();
    }
  };
  try {
    media.addEventListener("change", myFunc);
  } catch (error) {
    try {
    media.addListener(myFunc);
    } catch (error) {
      console.debug('Error', error)
    }
  }
}

参考：

这个其他S.O问题

Answer 4

如果只是为了跟踪目的，也许你可以在 CSS 打印媒体中设置一个后台 url 到服务器页面（.aspx、.php 等），然后在服务器上执行某些操作？

这家伙声称它有效。

这不像 TJ 的解决方案那么通用，但当只需要跟踪时，它可能会少一些错误（有关他发现的问题，请参阅 TJ 的博客文章）。