Wie erreicht man die Cross-Browser-Kompatibilität für „onbeforeprint()“ und „onafterprint()“?

Browserübergreifendes Äquivalent für onbeforeprint() und onafterprint()

Während IE die Funktionalität von onbeforeprint() und onafterprint() bietet, Diese Funktionalität wird nicht von allen Browsern nativ unterstützt. Erwägen Sie für eine browserübergreifende Lösung die Verwendung von window.matchMedia und window.onbeforeprint/window.onafterprint.

Mit window.matchMedia

window.matchMedia ermöglicht Ihnen die Erkennung wenn eine CSS-Medienabfrage aktiv wird. Im Falle des Druckens kann die Medienabfrage „Drucken“ verwendet werden. Fügen Sie dem window.matchMedia('print')-Objekt einen Ereignis-Listener hinzu, um eine Funktion vor und nach dem Drucken auszuführen:

if ('matchMedia' in window) {
    window.matchMedia('print').addListener(function(media) {
        if (media.matches) {
            beforePrint();
        } else {
            $(document).one('mouseover', afterPrint);
        }
    });
}

Beachten Sie, dass diese Technik zu mehreren Aufrufen von beforePrint() und afterPrint() führen kann. , abhängig vom Verhalten des Browsers.

Verwendung von window.onbeforeprint/window.onafterprint

IE und Firefox unterstützen die Ereignisse window.onbeforeprint und window.onafterprint. Hören Sie sich diese Ereignisse mit jQuery an:

$(window).on('beforeprint', beforePrint);
$(window).on('afterprint', afterPrint);

Implementierung

Weitere Informationen zu diesem browserübergreifenden Ansatz finden Sie unter https://tjvantoll.com/2012 /06/15/detecting-print-requests-with-javascript/

Das obige ist der detaillierte Inhalt vonWie erreicht man die Cross-Browser-Kompatibilität für „onbeforeprint()“ und „onafterprint()“?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!