Jquery 打印期间隐藏元素,打印完成后显示

Jquery 打印期间隐藏元素,打印完成后显示,jquery,html,printing,Jquery,Html,Printing,此链接包含jquery图表。图表演示的右上角有一个打印选项。它在打印过程中隐藏元素,这很容易做到,但它会在打印后显示所有元素。这意味着他们检测打印是否完成。如何在我自己的网页中实现这种打印技术?有javascript事件。正如您在本代码中看到的,摘自: IE5+和Firefox6+支持window.onbeforeprint和window.onafterprint,但对于Webkit浏览器,window.matchMedia有一个解决方案 这个解决方案不适用于Opera,只适用于Firefox


此链接包含jquery图表。图表演示的右上角有一个打印选项。它在打印过程中隐藏元素,这很容易做到,但它会在打印后显示所有元素。这意味着他们检测打印是否完成。如何在我自己的网页中实现这种打印技术?

有javascript事件。正如您在本代码中看到的,摘自:

IE5+和Firefox6+支持window.onbeforeprint和window.onafterprint,但对于Webkit浏览器,window.matchMedia有一个解决方案

这个解决方案不适用于Opera,只适用于Firefox、IE和WebKit浏览器

(function() {
    var beforePrint = function() {
        console.log('Functionality to run before printing.');
    };
    var afterPrint = function() {
        console.log('Functionality to run after printing');
    };

if (window.matchMedia) {
    var mediaQueryList = window.matchMedia('print');
    mediaQueryList.addListener(function(mql) {
        if (mql.matches) {
            beforePrint();
        } else {
            afterPrint();
        }
    });
}

window.onbeforeprint = beforePrint;
window.onafterprint = afterPrint;
}());