Распечатать разделы, которые были скрыты на экране с помощью JavaScript

Question

Я столкнулся с небольшой проблемой, с которой раньше не сталкивался: я использую javascript (jQuery) для отображения различных разделов информации во вкладках на веб-странице. Поэтому я скрываю вкладки, которые не просматриваются, и отображает только просматриваемые вкладки.

Это работает очень хорошо, но теперь я добавляю таблицу стилей, специфичную для печати, и хочу напечатать информацию обо всех вкладках, а не только о просматриваемой.

Как мне отменить скрытие javascript этих разделов для таблицы стилей печати?

Редактировать: Некоторая дополнительная информация:

Я использую jQuery, чтобы скрыть все div.tabs sections, и в своей таблице стилей печати я установил:

.wrapper div.tabs sections {
    display: block;
}

при условии, что более высокое значение .wrapper div.tabs sections по сравнению с div.tabs sections сделает разделы видимыми. Но это не так ...

Answer 1

Наилучшим подходом было бы изменить JavaScript таким образом, чтобы он модифицировал классы, применяемые к элементам, и не изменял .style.display.Тогда вы можете по-разному нацеливать элементы на эти классы с помощью таблиц стилей экрана и печатных носителей.

Быстрый и грязный подход заключается в использовании !important в таблице стилей печатных носителей.

Answer 2

Все, что вам действительно нужно, это CSS. Просто определите некоторые вещи, которые отображаются при печати. ​​

Вот и пример:

@media print {
    div.print_show{ dispay: block; }
    span.print_show{ display: inline; }
    .print_hide{ display: none; }
}

Answer 3

Вы можете добавить дополнительный класс для добавления display: block в ваш print.css ..