utilizando JavaScript para imprimir imágenes

me gustaría saber si es posible usar javascript para abrir una ventana emergente que contiene una imagen, y al mismo tiempo tienen el espectáculo de diálogo de impresión. Una vez que alguien hace clic en imprimir, la ventana emergente se cierra.utilizando JavaScript para imprimir imágenes

¿Es esto fácilmente posible?

Fuente

2010-05-25 andrew

Sí, sólo hay que poner la imagen en la pantalla, y luego llamar window.print(); en javascript y debe emergente.

(Esto es cómo Google Maps/Google Calendar hacer impresión)

Fuente

2010-05-25 22:44:52

Genial. Pero, ¿qué sucede si quiero mostrar una imagen diferente que inicie la ventana emergente? – andrew

Echa un vistazo a los estilos CSS para imprimir. Básicamente puede tener una imagen oculta en la vista de pantalla, y luego visible para la vista de impresión. –

popup = window.open(); 
popup.document.write("imagehtml"); 
popup.focus(); //required for IE 
popup.print();

Fuente

2010-05-25 22:48:31

¿Cómo funcionaría esto con un botón? El botón iniciaría esta acción, pero en realidad imprime una imagen separada. – andrew

No voy a escribir todo el código para ti, el objetivo de este lugar es aprender. ;) Lo harías usando el evento onmouseup en el botón: http://www.w3schools.com/jsref/event_onmouseup.asp –

No quiero que me lo escribas ... solo quiero apuntar a los recursos correctos. Necesito un lugar para comenzar Gracias. – andrew

Utilice esta en el bloque de la cabeza

<script type="text/javascript"> 
function printImg() { 
    pwin = window.open(document.getElementById("mainImg").src,"_blank"); 
    pwin.onload = function() {window.print();} 
} 
</script>

utilizar esto en el torso rígido

<img src="images.jpg" id="mainImg" /> 
<input type="button" value="Print Image" onclick="printImg()" />

Fuente

2012-09-04 03:21:50

Esto no funciona en la consola de Chrome. – Flea777

Este funciona en Chrome:

<body ><img src="image.jpg" alt="" style="display: block; width: 100%; height: 100%;"> 

      <script type="text/javascript"> 
       window.onload = function() { 
        window.print(); 
        setTimeout(function() { 
         window.close(); 
        }, 1); 
       }; 
      </script> 
    </body>

Fuente

2014-04-30 18:20:54

Este código se abrirá YOUR_IMAGE_URL en una ventana emergente, mostrar diálogo de impresión y cerrar la ventana emergente después de la impresión.

var popup; 

function closePrint() { 
    if (popup) { 
     popup.close(); 
    } 
} 

popup = window.open(YOUR_IMAGE_URL); 
popup.onbeforeunload = closePrint; 
popup.onafterprint = closePrint; 
popup.focus(); // Required for IE 
popup.print();

MDN Reference code

Fuente

2014-06-04 09:02:43

Otra gran solución !! Todo el crédito va a Codescratcher

<script type="text/javascript"> 
function ImagetoPrint(source) { 
    return "<html><head><script>function step1(){\n" + 
      "setTimeout('step2()', 10);}\n" + 
      "function step2(){window.print();window.close()}\n" + 
      "</scri" + "pt></head><body onload='step1()'>\n" + 
      "<img src='" + source + "' /></body></html>"; 
} 
function PrintImage(source) { 
    Pagelink = "about:blank"; 
    var pwa = window.open(Pagelink, "_new"); 
    pwa.document.open(); 
    pwa.document.write(ImagetoPrint(source)); 
    pwa.document.close(); 
}

<a href="#" onclick="PrintImage('YOUR_IMAGE_PATH_HERE.JPG'); return false;">PRINT</a>

Vea el ejemplo completo aquí: http://www.codescratcher.com/javascript/print-image-using-javascript/#comment-762

Fuente

2015-08-11 13:27:17

¿por qué hay un tiempo de espera de 10 ms? ¿Por qué no simplemente '' – Shasak

Ese sitio de codescratcher es un poco confuso Cargué este código en mi cuenta de github: Vea la demostración de trabajo aquí https://rawgit.com/orellabac/printFromJavascript/master/Print_Image.htm el código está en: https: //github.com/orellabac/printFromJavascript/ – orellabac

Acabo de pasar 45 minutos en este problema "SIMPLE", tratando de conseguir que la forma en que quería que funcione

Tenía una imagen dentro de una etiqueta img, generada dinámicamente por un complemento jQuery Barcode que tuve que imprimir. Quería que se imprimiera en otra ventana y luego cerrar la ventana. Esto se suponía todo a suceder cuando el usuario hace clic en un botón en el interior de un plugin jQuery Grid, dentro de un jQuery-UI de diálogo junto con jQuery-UI extensor de diálogo que se le aplica.

ajusté todo el mundo responde hasta que finalmente ocurrió esto, tal vez puede ayudar a alguien.

w = window.open(document.getElementById("UB-canvas").src); 
w.onload = function() { w.print(); } 
w.onbeforeunload = setTimeout(function() { w.close(); },500); 
w.onafterprint = setTimeout(function() { w.close(); },500);

El setTimeout es no sólo para mierdas y risitas, que es la única manera que encontré Firefox 42 golpearía esas funciones. Simplemente omitiría las funciones .close() hasta que agregué un punto de interrupción, luego funcionó perfectamente. Así que supongo que creó esas instancias de ventana antes de que pudiera aplicar la función de evento onforeforeload y las funciones de evento afterprint, o algo así.

Fuente

2015-12-02 18:42:42 Kickass

utilizando JavaScript para imprimir imágenes

Respuesta

Cuestiones relacionadas