クロスブラウザー アプリケーションで印刷イベントを検出するにはどうすればよいですか?

クロスブラウザ アプリケーションでの印刷イベントの検出

IE 以外のブラウザでは onbeforeprint() と onafterprint() が非推奨になっているにもかかわらず、これは、window.matchMedia と window.onbeforeprint/window.onafterprint を使用して同様の機能を実現する方法です。

window.matchMedia の使用

多くの最新ブラウザが window.matchMedia をサポートするようになりました。これにより、CSS メディア クエリの変更を検出できます。 window.matchMedia と window.onbeforeprint/window.onafterprint を組み合わせることで、印刷イベントを検出するクロスブラウザーのアプローチを作成できます。

イベント コールバック

次の関数は、window.matchMedia のイベント コールバックとして使用できます:

<code class="javascript">window.matchMedia('print').addListener(function(media) {
    if (media.matches) {
        // Print is starting
    } else {
        // Print has ended
    }
});</code>

レガシー IE および Firefox のサポート

window.matchMedia をサポートしていないブラウザの場合、 onbeforeprint および onafterprint イベントを直接リッスンすることは引き続き可能です:

<code class="javascript">$(window).on('beforeprint', beforePrint);
$(window).on('afterprint', afterPrint);</code>

注: 提供された応答で述べたように、window.matchMedia リスナーが一部のブラウザでは、単一の印刷ジョブ中に複数回起動される場合があります。これはイベント ハンドラーの実行に影響を与える可能性があるため、ロジックを設計する際にはこの動作を考慮してください。

以上がクロスブラウザー アプリケーションで印刷イベントを検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。