Vorrei sapere se è possibile utilizzare javascript per aprire una finestra popup contenente un'immagine e allo stesso tempo mostrare la finestra di dialogo di stampa. Una volta che qualcuno fa clic sulla stampa, il popup si chiude.Utilizzo di javascript per stampare le immagini
È facilmente raggiungibile?
Sì, basta mettere l'immagine sullo schermo, e quindi chiamare window.print(); in javascript e dovrebbe popup.
(questo è il modo di Google Maps/Google Calendar fare di stampa)
popup = window.open();
popup.document.write("imagehtml");
popup.focus(); //required for IE
popup.print();
Come funziona usando un pulsante? Il pulsante avvierebbe questa azione, ma in realtà stampa un'immagine separata. – andrew
Non scriverò tutto il codice per te, il punto di questo posto è imparare. ;) Lo farebbe usando l'evento onmouseup sul pulsante: http://www.w3schools.com/jsref/event_onmouseup.asp –
Non voglio che tu lo scriva per me ... voglio solo essere puntato sulle risorse giuste Ho bisogno di un posto dove iniziare. Grazie. – andrew
Utilizzare questo nel blocco di testa
<script type="text/javascript">
function printImg() {
pwin = window.open(document.getElementById("mainImg").src,"_blank");
pwin.onload = function() {window.print();}
}
</script>
utilizzare questo in blocco corpo
<img src="images.jpg" id="mainImg" />
<input type="button" value="Print Image" onclick="printImg()" />
Questo non funziona nella console di Chrome. – Flea777
Questo funziona in 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>
Questo codice aprirà YOUR_IMAGE_URL in una finestra popup, mostrerà la finestra di dialogo di stampa e chiuderà la finestra popup dopo la stampa.
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();
Un altro grande soluzione !! Tutto il merito 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>
Vedere l'esempio completo qui: http://www.codescratcher.com/javascript/print-image-using-javascript/#comment-762
perché c'è un timeout di 10 ms? Perché non semplicemente '' –
Shasak
Quel sito di codescratcher è un po 'confuso Ho caricato questo codice sul mio account github: Vedi la demo di lavoro qui https://rawgit.com/orellabac/printFromJavascript/master/Print_Image.htm il codice è a: https: //github.com/orellabac/printFromJavascript/ – orellabac
ho appena trascorso 45 minuti su questo problema "semplice", cercando di farlo il mio modo di volevo che funzionasse
Avevo un'immagine all'interno di un tag img, generato dinamicamente da un plug-in jQuery Barcode che dovevo stampare. Volevo che stampasse in un'altra finestra e poi chiudesse la finestra. Tutto ciò avrebbe dovuto succedere dopo che l'utente ha fatto clic su un pulsante all'interno di un plug-in , all'interno di una finestra di dialogo jQuery-UI insieme a un extender di dialogo jQuery-UI ad esso applicato.
Ho regolato tutte le risposte fino a quando ho finalmente trovato questo, forse può aiutare qualcuno.
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);
Il setTimeout non è solo per merda e risatine, è l'unico modo che ho trovato Firefox 42 avrebbe colpito tali funzioni. Sarebbe semplicemente saltare le funzioni .close() finché non ho aggiunto un punto di interruzione ad esso, quindi ha funzionato perfettamente. Quindi suppongo che abbia creato quelle istanze di finestre prima che potesse applicare la funzione di evento onbeforeload e le funzioni di evento onafterprint, o qualcosa del genere.
Freddo. Ma cosa succede se voglio un'immagine diversa per mostrare che inizia la finestra popup? – andrew
Controlla gli stili CSS per la stampa. Puoi fondamentalmente avere un'immagine nascosta nella visualizzazione dello schermo e quindi visibile per la visualizzazione di stampa. –