2010-11-11 5 views
3

После прочтения нескольких статей, форумов и т. Д., Он доходит до того момента, когда я нахожусь &, ищите свою помощь.Печать контейнера DIV без потери стилей CSS

Я пытаюсь добавить кнопку «Печать» на странице, которая при щелчке, распечатывает таблицу. Я пробовал jqprint (пока лучшее решение), но это все еще не так:

Макет страницы - это вкладка, содержащая аккордеон. Внутри этого аккордеона находится таблица с несколькими строками. Внутри каждой строки есть скрытые div.

Когда пользователь нажимает кнопку «Печать», отображаются скрытые divs, а затем вызывается команда jqprint для печати таблицы с использованием идентификатора в качестве селектора.

В FireFox: Когда я печатаю в PDF (чтобы сохранить бумагу и быть красивой с природой), печатаются только первые несколько строк таблицы. В принципе, PDF будет содержать много страниц, но я получаю только первый и ничего больше после этого.

В Chrome: Не работает вообще. PDF не заполнен.

Если вы знаете об исправлении для jqprint или имеете какие-либо отзывы по этой проблеме, заблаговременно.

Джонатан

ответ

0

Вы можете использовать другой CSS для печати, т.е. print.css и сделать все дивы видно, что вы хотите напечатать.

3

Styling html для печати обычно достигается с использованием другой таблицы стилей, например. в голове элемента:

<head> 
    ... 

    <link rel="stylesheet" type="text/css" media="screen" href="style.css"> 
    <link rel="stylesheet" type="text/css" media="print" href="print.css"> 
    ... 

</head> 

Лист style.css стиль используется для оформления вашего HTML на экране, в то время как print.css используется стиль вашего HTML для печати. Предоставляя соответствующий стиль в print.css, вы можете легко отображать или скрывать элементы html для достижения нужного результата.

+0

На данный момент у меня есть медиа = «все», так сохраняется стиль. Проблема в том, что я не могу печатать больше, чем то, что видно на экране для этого конкретного контейнера, будь то DIV или таблица, когда я использую jqprint в Firefox. – Jonas

0

Попробуйте использовать printThis плагин.

передать идентификатор элемента для печати.

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

$('#table_id').printThis({ pageTitle: $('#report_title').text()}); 

надеюсь, что это поможет вам

Смежные вопросы