Question

当用户打印某个网页时，我想将一些信息发送回我的数据库。我可以使用onbeforeprint()和onafterprint()在IE中执行此操作，但我想浏览不可知的方法来执行相同的操作。只要它完成，就不关心我必须使用哪种技术组合（PHP，MySQL，JavaScript，HTML）。有什么想法吗？

修改

还有一些问题。我尝试将我的函数放在我的Print.css中作为图像，但我正在弄乱它的一些方法。然后我尝试添加一个事件监听器，但我也无法让它正常工作。如果有人能提供一些关于如何在任何浏览器中打印前调用函数的更多细节，我将不胜感激。

修改

我现在放弃了这个，我已经采取了另一种方式来做我想做的事情。我期待着FireFox支持onbeforeprint（）和onafterprint（）的那一天。

Answer 1

Many browsers现在支持window.matchMedia。此API允许您检测CSS媒体查询何时生效（例如，旋转屏幕或打印文档）。对于跨浏览器方法，请将window.matchMedia与window.onbeforeprint / window.onafterprint合并。

以下内容可能会导致多次调用beforePrint()和afterPrint()（例如Chrome fires the listener every time the print preview is regenerated）。这取决于您为响应打印而执行的特定处理，这可能是也可能不合适。

if ('matchMedia' in window) {
    // Chrome, Firefox, and IE 10 support mediaMatch listeners
    window.matchMedia('print').addListener(function(media) {
        if (media.matches) {
            beforePrint();
        } else {
            // Fires immediately, so wait for the first mouse movement
            $(document).one('mouseover', afterPrint);
        }
    });
} else {
    // IE and Firefox fire before/after events
    $(window).on('beforeprint', beforePrint);
    $(window).on('afterprint', afterPrint);
}

更多：http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/

Answer 2

我不是sure other browsers will allow you to。您当然可以在打印样式表中的某个位置指定一个图像，该图像可能仅在打印时调用onbeforeprint

Answer 3

尝试使用您自己的... {/ p>屏蔽原生window.print()

// hide our vars from the global scope
(function(){

  // make a copy of the native window.print
  var _print = this.print;

  // create a new window.print
  this.print = function () {
    // if `onbeforeprint` exists, call it.
    if (this.onbeforeprint) onbeforeprint(this); 
    // call the original `window.print`.
    _print(); 
    // if `onafterprint` exists, call it.
    if (this.onafterprint) onafterprint(this);
  }

}())

更新：评论。

Answer 4

我认为这是不可能的。或者至少 - 不是我所知道的任何技术，也不是先前给出的任何答案。

使用onafterprint和使用服务器端动态图像生成脚本都会告诉您，即使访问者只是打印预览模式然后取消，页面也会打印出来。

但是，我想了解如何获取正确的信息，以便我确定该页面实际上已打印出来。

Answer 5

(function() {
var beforePrint = function() {
    if($('.modal').hasClass('in')){
        $('body').removeClass('modal-open');
    }
};
var afterPrint = function() {
    if($('.modal').hasClass('in')){
        $('body').addClass('modal-open');
    }
};

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

此代码适用于所有用于检测打印事件的浏览器。

onbeforeprint（）和onafterprint（）等效于非IE浏览器

5 个答案: