Imprimir contenido DIV por JQuery

supongamos que tengo muchos div en mi página, pero quiero imprimir el contenido de div específico utilizando jquery. encontré que hay un complemento para eso.Imprimir contenido DIV por JQuery

jQuery Print Element

uso de este plugin podemos imprimir fácilmente div de contenido, como a continuación.

$('SelectorToPrint').printElement();

pero ¿qué ocurre si mi div está oculto en la página. Entonces funciona? este complemento puede imprimir el contenido de Div oculto?

qué sucede si la impresora no está conectada con la máquina del cliente. Quiero mostrar un mensaje si la impresora no está allí para decir al cliente que "Impresora no encontrada"? cómo manejar esta situación así que por favor avísenme cuál sería el mejor enfoque para imprimir el contenido de div oculto en la página y también manejar el problema de la impresora si la impresora no está conectada.

gracias

Fuente

2011-09-23 Keith Costa

¿Te incluso trató de usarlo? – Jack

div oculto no impreso con el plugin http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/ –

su pregunta no suena como si aún probado a sí mismo, así que ni siquiera debería pensar en responder, pero: si un div oculto no puede imprimirse con una línea que:

$('SelectorToPrint').printElement();

simplemente cambiarlo a:

$('SelectorToPrint').show().printElement();

que debería hacer que funcione en todos los casos.

para el resto, no hay solución. el complemento abrirá el cuadro de diálogo de impresión donde el usuario tenga que elegir su impresora. simplemente no puede averiguar si una impresora está conectada con javascript (y usted (casi) no puede imprimir sin imprimir-diálogo, si está pensando en eso).

NOTA:

El objeto $.browser se ha eliminado en la versión 1.9.x de jQuery haciendo de esta biblioteca no compatible.

Fuente

2011-09-23 14:14:54 oezi

Hay una manera de usar esto con un div oculto pero tiene que trabajar un poco más con la función printElement() y css.

Css:

#SelectorToPrint{ 
    display: none; 
}

Guión:

$("#SelectorToPrint").printElement({ printBodyOptions:{styleToAdd:'padding:10px;margin:10px;display:block', classNameToAdd:'WhatYouWant'}})

Esto anulará la pantalla: ninguno en la nueva ventana se abre y el contenido se mostrará en la página de vista preliminar y el div en tu sitio permanece oculto.

Fuente

2013-02-19 10:26:05 user2086598

tratar esta biblioteca jQuery, jQuery Elementos de Impresión

http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/

Fuente

2013-03-25 09:36:52

prefiero éste, he probado y su trabajo

https://github.com/jasonday/printThis

$("#mySelector").printThis();

$("#mySelector").printThis({ 
*  debug: false,    * show the iframe for debugging 
*  importCSS: true,   * import page CSS 
*  printContainer: true,  * grab outer container as well as the contents of the selector 
*  loadCSS: "path/to/my.css", * path to additional css file 
*  pageTitle: "",    * add title to print page 
*  removeInline: false  * remove all inline styles from print elements 
* });

Fuente

2013-08-08 00:22:53

Puede seguir estos pasos:

envolver el div que desea imprimir en otro div.
establece el estado de la pantalla div del contenedor en none en css.
mantener el div que desea imprimir el estado de visualización como bloque, de todos modos se ocultará ya que su principal está oculto.
simplemente llaman $('SelectorToPrint').printElement();

Fuente

2014-04-24 14:05:56 user826876

que aquí hay una solución jQuery & JavaScript para imprimir div como él estilos (con css interna y externa)

$(document).ready(function() { 
      $("#btnPrint").live("click", function() {//$btnPrint is button which will trigger print 
       var divContents = $(".order_summery").html();//div which have to print 
       var printWindow = window.open('', '', 'height=700,width=900'); 
       printWindow.document.write('<html><head><title></title>'); 
       printWindow.document.write('<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" >');//external styles 
       printWindow.document.write('<link rel="stylesheet" href="/css/custom.css" type="text/css"/>'); 
       printWindow.document.write('</head><body>'); 
       printWindow.document.write(divContents); 
       printWindow.document.write('</body></html>'); 
       printWindow.document.close(); 

       printWindow.onload=function(){ 
       printWindow.focus();           
       printWindow.print(); 
       printWindow.close(); 
       } 
      }); 
});

Esto imprimirá el div en una nueva ventana.

botón para activar evento

<input type="button" id="btnPrint" value="Print This">

Fuente

2017-05-20 06:12:09 CyberAbhay

Respuesta

Cuestiones relacionadas