разрешить пользователю скрывать стили печати

Question

У меня есть система счетов, которую я построил для моего клиента с конфиденциальными данными в заголовке и информацией о заказе во втором div

В настоящее время у меня есть этот набор стилей:

@media print {
.topbar {
    display:none;
}
}

, поэтомуклиент может распечатать счет-фактуру и отправить его своему клиенту без информации в .topbar, отображаемой на распечатанной странице.

Теперь он хочет выбрать из выпадающего списка выборку либо счет-фактуру клиента (без содержимого в .topbar) или распечатайте полный счет-фактуру с информацией .topbar для его собственного использования.

Я застрял на том, как мне поступить.Я знаю, как использовать onchange, но я не уверен, какой метод использовать для отключения, включения (@media print) стилей.

любая помощь будет принята с благодарностью, считает Томми

Answer 1

CSS:

 <style type="text/css">
    .topBar { ... }
    @media print { .topBarPrint { display: none; }}
 </style>

HTML:

<div id="topBar" class="topBar topBarPrint">Sensitive Content</div>

Затем просто добавьте или удалите класс topBarPrint, используя addClass () и removeClass () , в зависимости от значения раскрывающегося списка.

Answer 2

Используйте методы JQuery addClass () и removeClass (). Когда вам нужно это скрыть, addClass(".topbar"), в противном случае .removeClass(".topbar")