Hola.
Aquí estoy de nuevo con una duda de HTML/Javascript.
Resulta que quiero que cuando un usuario le de al botón de imprimir que tengo en un informe generado en HTML, éste se oculte para que no salga en la impresión y que automáticamente vuelva a aparecer tras la misma.
Se supone que con ésto funciona:
onPrintButtonClicked()
{
var printButton = document.getElementById('printButton');
printButton.style.display = 'none';
print();
printButton.style.display = '';
}
Pero a mí no me funciona. Efectivamente desaparece y cuando confirmo el cuadro de diálogo de configuración de impresión me aparece de nuevo, pero aún así sale en la copia impresa.
Así que, ¿se os ocurre algo para solucionar ésto?.
Se me había ocurrido hacer un "sleep" durante un par de segundos o así pero me parece algo cutre. :P
Gracias.
No tuvo Kabila problemas también imprimiendo desde html? Ahora no encuentro el post pero me parece recordar que si...
siento no poder ser de más ayuda!
Hola.
En cosas de redes no debes implementar una feature en capa de aplicacion si la puedes implementar en capa de protocolo.
Igualmente no debes implementar algo en html si lo puedes hacer en CSS, o en HTTP.
Y no debes hacer algo en javascript si lo puedes hacer con CSS o html o http.
En tu caso lo que estas haciendo se puede hacer con CSS, por tanto se debe hacer en CSS y no en javascript.
Consiste en tener una hoja de estilos separada para el medio "print" de modo que sea la que se escoge para imprimir.
Tendrias entonces una hoja CSS para "screen" otra para "print" y posiblemente otra para "handheld". En esta hoja para impresion, simplemente ocultas lo que no quieres que aparezca, y modificas un poco el layout porque por ejemplo en impresion no tienen sentido los menus de navegacion.
Muchas gracias Tei, desde luego es la forma más elegante.
Por si a alguien le interesa esto es una prueba que he hecho:
<html>
<head>
<title>Prueba</title>
<style type="text/css">
@media screen
{
.hiWorld
{
font-size: 20px;
}
}
@media print
{
.printButton
{
display: none;
}
.hiWorld
{
font-size: 20px;
font-weight: bold;
}
}
</style>
</head>
<body>
<span class="hiWorld">Hi world!</span>
<input type="button" class="printButton" value="Print" onclick="javascript:print();" />
</body>
</html>
Saludos.
Interesante
¿Como se cambia entre un estilo y otro?
Cita de: "bnl"Interesante
¿Como se cambia entre un estilo y otro?
Eso es lo mejor de todo. Es automático. :)
Buscando por google he encontrado que tambien se pueden poner en hojas de estilos de la forma tradicional pero añadiendo el atributo media:
<link href="impresion.css" media="print" rel="stylesheet" type="text/css" />
<link href="general.css" media="screen" rel="stylesheet" type="text/css" />
la mejor manera es la de Tei claro, pero si quieres saber como hacer la "chapucilla" en js :P , creo que te funcionaría con
printButton.style.visibility = 'hidden';
print();
printButton.style.visibility = 'visible';