Проверьте, когда пользователь выбрал для печати с использованием JavaScript

Question

Когда пользователь выбирает «Файл> Печать» в браузере, таком как Firefox или Internet Explorer, или нажимает на ссылку, которая запускает приведенный ниже JavaScript

window.print();

Есть ли способ условно проверить этот режим и отключить НЕКОТОРЫЙ javascript.

Я пытаюсь сделать это, потому что у меня есть плагин, который добавляет свою собственную пользовательскую разметку для закругленных границ, и даже в определенной для печати таблице стилей я не могу переопределить стили для них, я не хочу, чтобы при печати выводились границы страница.

РЕДАКТИРОВАТЬ: Не имеет отношения к плагину, есть изменения стиля, сделанные с помощью javascript, который используется для создания пользовательского интерфейса с вкладками, и я сделал специальный CSS для печати, чтобы переопределить стиль, и он отлично работает, когда я использую Панель инструментов веб-разработчика Firefox> CSS> Показать CSS по типу мультимедиа> Печать .. но когда я распечатываю его, он не работает, javascript вступает во владение и меняет стиль ... если я полностью отключаю javascript, то печать, очевидно, снова работает нормально .

Спасибо

Answer 1

Для этого есть универсальное решение, а также немного хакерских атак для старых браузеров. Вы можете переопределить метод print() во всех браузерах:

(function (oldPrint) { 
    window.print = function () {
        document.getElementById("hideThis").style.display = 'none';
        oldPrint();
    }
})(window.print);

Проблема здесь в том, что он не будет срабатывать для пользователей, нажимающих Ctrl + P или получающих доступ к меню файла для печати. Internet Explorer предлагает решение с помощью события onbeforeprint:

if ("onbeforeprint" in window) {
    var hideEl = document.getElementById("hideThis");
    window.onbeforeprint = function () { 
        hideEl.style.display = 'none';
    }
    window.onafterprint = function () {
        hideEl.style.display = '';
    }
}

Что касается других браузеров, вы можете добавить прослушиватель событий для печати MediaQueryList как , подробно описанный TJ VanToll в другом ответе.

if (window.matchMedia) {
    var mqList = window.matchMedia("print"),
        hideEl = document.getElementById("hideThis");

    mqList.addListener(function (mql) {
        hideEl.style.display = mql.matches ? 'none' : '';
    }); 
}

И все это вместе:

(function () {
    var hideEl = document.getElementById("hideThis");

    // HTML5 spec, IE 5.5+, Firefox 6.0+
    if ("onbeforeprint" in window) {
        window.onbeforeprint = function () { 
            hideEl.style.display = 'none';
        }
        window.onafterprint = function () {
            hideEl.style.display = '';
        }
    }

    // Chrome 9+, Opera 12.1+, Safari 5.1+
    else if (window.matchMedia) {
        var mqList = window.matchMedia("print");

        mqList.addListener(function (mql) {
            hideEl.style.display = mql.matches ? 'none' : '';
        }); 
    }

    // Your fallback method, only working for JS initiated printing
    else {    
        (function (oldPrint) { 
            window.print = function () {
                hideEl.style.display = 'none';
                oldPrint();
            }
        })(window.print);
    }
})();

Answer 2

Вы можете сделать:

window.old_print=window.print
window.print=function() {
    alert('doing things');
    window.old_print();
}

, но это будет перехватывать вызовы print() изнутри javascript страницы.

Вы пытались поместить !important в таблицу стилей для печати?