Печать только текстового поля

Question

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

Какова наилучшая стратегия для решения этой проблемы?

Answer 1

Создайте таблицу стилей печати, где все элементы кроме textarea установлены в CSS для отображения: none ;, а для текстового поля переполнение: видимое.

Свяжите его со страницей с тегом ссылки в заголовке, указанном в media = "print".

Все готово.

Answer 2

сделать различные CSS с набором носителей для печати

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

http://webdesign.about.com/cs/css/a/aa042103a.htm

Answer 3

Если пользователь нажимает кнопку «Печать» можно открыть новое окно только с содержимым текстового поля на пустой странице и начать печать там, затем закройте это окно.

Обновление: Я думаю, что предлагаемые CSS-решения, вероятно, являются лучшими стратегиями, но если кому-нибудь понравится это предложение, они все равно могут его перенести.

Answer 4

Я бы выбрал комбо других предложений.

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

Эта кнопка откроет новое окно с меню/хром и т.д., и клонировать содержимое текстовой только (и, или предоставить файл для печати CSS)

Answer 5

Я сделал печатных СМИ CSS, чтобы скрыть несколько полей , Проблема осложнялась тем, что я использовал nicEdit, который динамически создает IFRAME. Поэтому мне пришлось добавить событие, которое заняло события onblur и скопировало их на скрытый (кроме печати) Div. «divtext» - это хиддовое Div, а «storyText» - это TextArea.

textarea { 
    display: none; 
} 

*/ #divtext { 
    display: block; 
} 

div, DIV { 
    border-style: none !important; 
    float: none !important; 
    overflow: visible !important; 
    display: inline !important; 
} 

/* disable nearly all styles -- especially the nicedit ones! */ 

#nav-wrapper, #navigation, img, p.message, .about, label, input, button, #nav-right, #nav-left, .template, #header, .nicEdit-pane, .nicEdit-selected, .nicEdit-panelContain, .nicEdit-panel, .nicEdit-frame { 
    display: none !important; 
} 

/*hide Nicedit buttons */ 

.nicEdit-button-active, .nicEdit-button-hover, .nicEdit-buttonContain, .nicEdit-button, .nicEdit-buttonEnabled, .nicEdit-selectContain, .nicEdit-selectControl, .nicEdit-selectTxt { 
    display: none !important; 
} 

Javascript код nicEdit:

<script type="text/javascript" src="/media/nicEdit.js"></script> 
<script type="text/javascript"> 
    bkLib.onDomLoaded(function() { 
    var nic = new nicEditor({ 
     fullPanel: true 
    }).panelInstance('storyText'); 

    document.getElementById("storyText").nic = nic; 
    nic.addEvent('blur', function() { 
     document.getElementById("storyText").value = 
     nic.instanceById('storyText').getContent(); 
     document.getElementById("divtext").innerHTML = nic.instanceById('storyText').getContent(); 
    }); 
    }); 
</script> 

Answer 6

Did переполнения: видимый; на textarea действительно работает для любого из вас? FF3, похоже, игнорирует это правило на textarea в листах печати. Не то, чтобы это ошибка или что-то еще.