onbeforeprintとonafterprintはChromeとIEでは動作していませんか？

Question

私は自分のプロジェクトで印刷を使用しています（HTMLとjavascriptの使用）。 mozilla onbeforeprintとonafterprintは正常に動作していますが、クロムでは動作しません。

Answer 1

Chrome doesn't have onbeforeprint.

これを行うための好ましい方法はprint media specific stylesheetsを使用することです。

あなたが絶対にPrint operations with javascript cross browserを検出する必要がある場合、これは有望に見えますが、私はそれを自分で試していません。

Answer 2

In Chromeでは、前回の印刷時に& onAfterPrintが動作しません。

しかし、あなたはこのCSSは、ページのヘッダーに含まれているCSSの印刷メディア

例

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

を使用して印刷ページを制限することができます。クロームのために働く何

CSSた次のスタイル

#header, #menu, #entry-content, .noprint {display: none;} 

Answer 3

は、のように '窓' の 'matchmedia' をチェックすることです：

   if ('matchMedia' in window) { 
        window.matchMedia('print').addListener(function (media) { 
        //do before-printing stuff 
        }); 
       } else { 
        window.onbeforeprint = function() { 
        //do before-printing stuff 
        } 
       } 

Answer 4

Chromeはこれらのイベントをサポートしていません。代わりに 'window.matchMedia'をサポートしています。また、すべてのページを印刷できないようにするbug in Chromeもあります。このため、ウェブページに印刷ボタンを追加して、Chromeメニューから印刷する代わりにボタンを使用するようユーザーに依頼することをおすすめします。

var beforePrint = function() { 
    console.log("before"); 
}; 
var afterPrint = function() { 
    console.log("after"); 
}; 

var launchedFromMenu = true; 
if (window.matchMedia) { 
    var mediaQueryList = window.matchMedia('print'); 
    mediaQueryList.addListener(function(mql) { 
     if (mql.matches) { 
      if(launchedFromMenu) { 
       // https://bugs.chromium.org/p/chromium/issues/detail?id=571070 
       alert("There is a bug in Chrome/Opera and printing via the main menu does not work properly. Please use the 'print' icon on the page."); 
      } 
      beforePrint(); 
     } else { 
      afterPrint(); 
     } 
    }); 
} 

// These are for Firefox 
window.onbeforeprint = beforePrint; 
window.onafterprint = afterPrint; 

function printPage() { 
    window["beforePrint"](); 
    launchedFromMenu = false; 
    window.print(); 

} 

Answer 5

クイック更新、印刷イベントhas improved a lot

• のサポートクローム63は、2017年12月中のリリースでは、それをサポートしているので、source
• オペラ50と同様
• エッジが始まり
ので、それをサポートしています
• IE（6！）の古いバージョン6でもサポートしています