javascript - examples - cómo detectar el acabado de window.print()
jquery methods (12)
Creo que el enfoque de enfoque de ventana es el correcto. Aquí hay un ejemplo en el que quería abrir un blob de URL en PDF en un iframe oculto e imprimirlo. Después de imprimir o cancelar, quería eliminar el iframe.
/**
* printBlob will create if not exists an iframe to load
* the pdf. Once the window is loaded, the PDF is printed.
* It then creates a one-time event to remove the iframe from
* the window.
* @param {string} src Blob or any printable url.
*/
export const printBlob = (src) => {
if (typeof window === ''undefined'') {
throw new Error(''You cannot print url without defined window.'');
}
const iframeId = ''pdf-print-iframe'';
let iframe = document.getElementById(iframeId);
if (!iframe) {
iframe = document.createElement(''iframe'');
iframe.setAttribute(''id'', iframeId);
iframe.setAttribute(''style'', ''position:absolute;left:-9999px'');
document.body.append(iframe);
}
iframe.setAttribute(''src'', src);
iframe.addEventListener(''load'', () => {
iframe.contentWindow.focus();
iframe.contentWindow.print();
const infanticide = () => {
iframe.parentElement.removeChild(iframe);
window.removeEventListener(''focus'', infanticide);
}
window.addEventListener(''focus'', infanticide);
});
};
En mi aplicación, traté de imprimir una página de cupones para el usuario, utilicé:
var htm ="<div>Voucher Details</div>";
$(''#divprint'').html(htm);
window.setTimeout(''window.print()'',2000);
'' divprint '' es un div en mi página que almacena información sobre el voucher.
Funciona, y aparece la página de impresión. Pero quiero continuar con la aplicación una vez que el usuario haga clic en " print " o " close " la ventana emergente.
por ejemplo, me gustaría redirigir al usuario a otra página después de que se cierre la ventana emergente:
window.application.directtoantherpage();//a function which direct user to other page
¿Cómo se determina si la ventana emergente de impresión está cerrada o la impresión finalizada?
Dado que desea esperar a que desaparezca el diálogo de impresión, utilizaría el enlace de enfoque en la ventana.
print();
var handler = function(){
//unbind task();
$(window).unbind("focus",handler);
}
$(window).bind("focus",handler);
Al poner en la desvinculación en la función del controlador, evitamos que el evento de enfoque permanezca unido a la ventana.
En Chrome 41.0 ... tengo que poner esto
Imprimo automáticamente en la página de carga:
<body style="background-color:white;" onload="print_window();">
JS:
function print_window(){
window.print();
setTimeout(function () {
window.open('''', ''_self'', '''');
window.close();
}, 100);
}
Funciona también para IE 10
En Firefox e Internet Explorer puede escuchar el evento posterior a la impresión.
https://developer.mozilla.org/en-US/docs/Web/API/window.onafterprint
window.onafterprint = function(){
console.log("Printing completed...");
}
Es posible usar window.matchMedia para obtener esta funcionalidad en otros navegadores.
(function() {
var beforePrint = function() {
console.log(''Functionality to run before printing.'');
};
var afterPrint = function() {
console.log(''Functionality to run after printing'');
};
if (window.matchMedia) {
var mediaQueryList = window.matchMedia(''print'');
mediaQueryList.addListener(function(mql) {
if (mql.matches) {
beforePrint();
} else {
afterPrint();
}
});
}
window.onbeforeprint = beforePrint;
window.onafterprint = afterPrint;
}());
Fuente: http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/
En cromo (V.35.0.1916.153 m) Pruebe esto:
function loadPrint() {
window.print();
setTimeout(function () { window.close(); }, 100);
}
Funciona muy bien para mi Cerrará la ventana después de que el usuario termine de trabajar en el diálogo de impresión.
Esto realmente funcionó para mí en cromo. Estaba bastante sorprendido.
jQuery(document).bind("keyup keydown", function(e){
if(e.ctrlKey && e.keyCode == 80){
Print(); e.preventDefault();
}
});
Donde Print es una función, escribí que llama a window.print (); También funciona como un bloqueador puro si deshabilita Imprimir ();
Como se señala aquí por user3017502
window.print () se pausará para que pueda agregar un onPrintFinish o onPrintBegin como este
function Print(){
onPrintBegin
window.print();
onPrintFinish();
}
Imprima en una nueva ventana con w = window.open (url, ''_blank'') y pruebe w.focus (); w.close (); y detectar cuando la página está cerrada. Funciona en todos los navegadores.
w = window.open(url, ''_blank'');
w.onunload = function(){
console.log(''closed!'');
}
w.focus();
w.print();
w.close();
Ventana cerrada después de la impresión final.
Probado IE, FF, Chrome y funciona en todos.
setTimeout(function () { window.print(); }, 500);
window.onfocus = function () { setTimeout(function () { window.close(); }, 500); }
Puede detectar cuándo window.print () termina simplemente poniéndolo en otra función
//function to call if you want to print
var onPrintFinished=function(printed){console.log("do something...");}
//print command
onPrintFinished(window.print());
probado en Firefox, Google Chrome, IE
Ver https://.com/a/15662720/687315 . Como solución alternativa, puede escuchar el evento afterPrint en la ventana (Firefox e IE) y escuchar el movimiento del mouse en el documento (indicando que el usuario ha cerrado el cuadro de diálogo de impresión y vuelto a la página) después de la window.mediaMatch API indica que los medios ya no coinciden con "imprimir" (Firefox y Chrome).
Tenga en cuenta que el usuario puede o no haber realmente impreso el documento. Además, si llama a window.print() demasiada frecuencia en Chrome, es posible que ni siquiera se le haya solicitado imprimir.
compatible con Chrome, Firefox, Opera, Internet Explorer
Nota: se requiere jQuery.
<script>
window.onafterprint = function(e){
$(window).off(''mousemove'', window.onafterprint);
console.log(''Print Dialog Closed..'');
};
window.print();
setTimeout(function(){
$(window).one(''mousemove'', window.onafterprint);
}, 1);
</script>
window.print se comporta de forma síncrona en Chrome ... prueba esto en tu consola
window.print();
console.log("printed");
"impreso" no se muestra a menos que el usuario cierre el cuadro de diálogo de impresión (cancelado / guardado / impreso).
Aquí hay una explicación más detallada sobre este tema.
No estoy seguro acerca de IE o Firefox comprobará y actualizará eso más tarde