すべてのブラウザに印刷機能を実装するにはどうすればよいでしょうか?

Patricia Arquette
リリース: 2024-11-01 18:00:30
オリジナル
153 人が閲覧しました

How Can You Implement Print Functionality Across All Browsers?

IE の onbeforeprint() および onafterprint() に相当するクロスブラウザー

Web 開発者は、複数のブラウザーにわたって印刷機能を実装するという課題に直面することがよくあります。 。 Internet Explorer は便利な onbeforeprint() および onafterprint() イベントを提供しますが、他のブラウザではより堅牢なアプローチが必要です。

クロスブラウザ検出用の Window.matchMedia

モダンChrome、Firefox、Internet Explorer 10 などのブラウザは、window.matchMedia のサポートを提供します。この API を使用すると、印刷などの CSS メディア クエリが有効になったことを検出できます。 window.matchMedia と window.onbeforeprint/window.onafterprint を組み合わせることで、クロスブラウザー ソリューションを実現できます。

印刷検出用のイベント リスナー

次のコードを使用します。スニペットを参照すると、開発者はほとんどの主要なブラウザで印刷イベントを検出できます。

<code class="javascript">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);
}</code>
ログイン後にコピー

追加リソース

さらに詳しい情報とコード例については、次のリソースを参照してください。

  • [JavaScript を使用した印刷リクエストの検出](http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/)

作成者window.matchMedia とイベント リスナーを活用することで、Web 開発者は幅広いブラウザと互換性のある印刷機能を実装でき、ユーザーにシームレスな印刷エクスペリエンスを保証できます。

以上がすべてのブラウザに印刷機能を実装するにはどうすればよいでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!