texto - imprimir una seccion de la pagina javascript

Imprimir solo un área de texto

Question

Me gustaría imprimir solo los contenidos de un elemento textarea de una página web. En particular, me gustaría asegurar que nada quede recortado por el límite del área de texto ya que el contenido será bastante grande.

¿Cuál es la mejor estrategia para abordar esto?

Answer 1

Cree un CSS diferente con medios configurados para imprimir

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

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

Answer 2

Cree una hoja de estilo de impresión donde todos los elementos excepto el área de texto estén configurados en CSS para mostrar: ninguno ;, y para el área de texto, desbordamiento: visible.

Vincúlelo a la página con la etiqueta de enlace en el encabezado establecido en media = "print".

Ya terminaste

Answer 3

Hice una CSS de medios impresos para ocultar varios de los campos. El problema fue complicado por el hecho de que estaba usando nicEdit que crea dinámicamente un IFRAME. Así que tuve que agregar un evento que tomaba eventos borrosos y los copiaba a una Div (Div. Oculta) oculta. "divtext" es el div hiddent, y "storyText" es el 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;
}

El código javascript para nicEdit: 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 '').obtener el contenido(); }); });

Answer 4

Iría por un combo de las otras sugerencias.

No elimine el botón de impresión de toda la página con una anulación de hoja de estilo, sino que proporcione un botón junto al área de texto, que permita al usuario imprimir solo esos contenidos.

Ese botón abriría una nueva ventana, con menús / cromo, etc. y clonaría solo el contenido de texto (y / o proporcionaría un archivo css de impresión)

Answer 5

Si el usuario hace clic en "Imprimir", puede abrir una nueva ventana con solo el contenido del área de texto en una página en blanco e iniciar la impresión desde allí, luego cierre esa ventana.

Actualización : creo que las soluciones de CSS que se sugieren son probablemente mejores estrategias, pero si a alguien le gusta esta sugerencia, todavía pueden votarlo mejor.

Answer 6

El desbordamiento: visible; en textarea realmente funciona para cualquiera de ustedes? FF3 parece ignorar esa regla en textarea en hojas impresas. No es que sea un error ni nada.