Как мне предложить 2 варианта печати?

Question

Я знаю, что javascript window.print () работает, когда вы хотите напечатать веб-страницу, но у меня есть клиент, которому требуются две опции.

1. Нажмите на ссылку для печати в цвете
2. Печать черно-белым.

Я знаю, что это можно сделать с помощью таблицы стилей печати, где вы можете установить div в качестве дисплея: нет и т. Д., Но я не уверен, как вызвать каждый параметр при нажатии. Требуется ли какой-нибудь JavaScript?

Answer 1

Я бы предложил иметь две таблицы стилей печати, а затем пару радио-кнопок для выбора Цвет или Черно-белый. Измените таблицу стилей печати при смене переключателя, затем просто установите одну кнопку печати, которая вызывает print().

Answer 2

Я думаю, что самый простой способ сделать это в первую очередь с помощью CSS - настроить таблицу стилей печати с цветными и ч / б параметрами, которые переключаются с классом body, например:

/* default option: color */
h1 { color: #00C; }

/* b/w option */
body.bw h1 { color: #666 }

Затем используйте Javascript для переключения класса bw на тег body.Такие инструменты, как jQuery, делают это очень простым, но если вам нужно сделать это без библиотеки, попробуйте:

// these functions assume you don't already have any
// CSS classes set on the body element

function printBW() {
    document.body.setAttribute('class', 'bw');
    window.print();
}

function printColor() {
    document.body.setAttribute('class', '');
    window.print();
}

и в вашем HTML:

<a href="javascript:printColor()">Print color</a> |
<a href="javascript:printBW()">Print B/W</a> 

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