代码之家  ›  专栏  ›  技术社区  ›  ubiquibacon

OnBeforePrint()和OnAfterPrint()相当于非IE浏览器

  •  17
  • ubiquibacon  · 技术社区  · 14 年前

    当用户打印某个网页时,我想将一些信息发送回我的数据库。我可以用 onbeforeprint() onafterprint() 但我想浏览不可知论的方式做同样的事情。不管我必须使用哪种技术组合(php、mysql、javascript、html),只要它完成了。有什么想法吗?

    编辑:

    还是有一些问题。我试着把我的功能 Print.css 作为一个形象,但我是搞砸了一些如何。然后我试着添加一个事件监听器,但是我也不能让它正常工作。如果有人能在任何浏览器中打印之前提供更多关于如何调用函数的详细信息,我将不胜感激。

    编辑:

    我现在已经放弃了,我已经决定用另一种方式去做我想做的事情。我期待着有一天火狐支持OnBeforePrint()和OnAfterPrint()。

    5 回复  |  直到 8 年前
        1
  •  6
  •   Wrikken    14 年前

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

        2
  •  31
  •   Ben Vassmer    10 年前

    Many browsers 现在支持 window.matchMedia . 此API允许您检测CSS媒体查询何时生效(例如,旋转屏幕或打印文档)。对于跨浏览器方法,结合 窗口.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/

        3
  •  4
  •   Dagg Nabbit    14 年前

    尝试屏蔽本机 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);
      }
    
    }())
    

    更新:评论。

        4
  •  0
  •   userfuser    12 年前

    我认为这是完全不可能的。或者至少-我不知道任何技术,也不知道之前给出的任何答案。

    无论是使用OnAfterprint还是使用服务器端动态图像生成脚本,都会告诉您页面已打印,即使访问者只是进入打印预览模式,然后取消打印。

    但是,我想学习如何获得适当的信息,以便 当然 那页实际上是印刷的。

        5
  •  0
  •   Dayachand Patel    8 年前
    (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;}());
    

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