Stampa del contenuto di un div tramite javascript

**mtk-kun** · 05-04-2012, 21:04

Salve a tutti, ho un problema che sicuramente mi saprete risolvere:

ho una pagina con all'interno molti div, mi servirebbe poterli stampare, in rete ho reperito questo script:

codice:

<script type="text/javascript">
function Stampa(){
     // Prelevo dalla pagina solo i blocchi che interessano
     // Ad esempio il titolo e il corpo di un articolo
     var titolo = document.getElementById('div_id').innerHTML;
     var corpo = document.getElementById('div_id2').innerHTML;

     // Apro una finestra pop-up nella quale inserisco i blocchi
     var a = window.open('','','width=640,height=480');
     a.document.open("text/html");
     a.document.write("<html><head></head><body>");

     // Scrivo il titolo e il corpo con un pò di stile in CSS
     a.document.write("<div style='border: 1px solid #CCCCCC'>"+titolo+"</div>
"+corpo);
     a.document.write("</body></html>");
     a.document.close();

     // Invio il documento alla stampante
     a.print();
}
</script>

mentra ll'interno del div che devo stampare richiama la funzione tramite questo codice

codice:

<input type='button' value='Stampa' onClick='Stampa()' />

che funziona alla stragrande, però funziona su un div prestabilito, a me servirebbe che cliccando sul bottone stampa all'interno di un div mi stampi quel determinato div, quindi è possibile creare la funzione generica e mandare il parametro specifico una volta cliccato sul bottone stampa?

grazie in anticipo!

**Xinod** · 05-04-2012, 21:12

function Stampa(idDiv){
// Prelevo dalla pagina solo i blocchi che interessano
// Ad esempio il titolo e il corpo di un articolo
var titolo = document.getElementById(idDiv).innerHTML;
var corpo = document.getElementById(idDiv).innerHTML;

etc etc

<input type='button' value='Stampa' onClick='Stampa("div_id2")' />

ciao

**mtk-kun** · 05-04-2012, 21:43

ti ringrazio per la rapida risposta

ho fatto delle prove ma senza successo, probabilmente sbaglio io qualcosa, nella parte

codice:

function Stampa(idDiv){
// Prelevo dalla pagina solo i blocchi che interessano
// Ad esempio il titolo e il corpo di un articolo
var titolo = document.getElementById(idDiv).innerHTML;
var corpo = document.getElementById(idDiv).innerHTML;

dove c'è Stampa(idDiv) devo lasciare idDiv o devo cambiarlo con qualche parametro?

per completezza ti posto gli esempi sui quali ho fatto le prove

script

codice:

<script type="text/javascript">
function Stampa(idDiv){
     // Prelevo dalla pagina solo i blocchi che interessano
     // Ad esempio il titolo e il corpo di un articolo
     var titolo = document.getElementById('idDiv').innerHTML;

     // Apro una finestra pop-up nella quale inserisco i blocchi
     var a = window.open('','','width=640,height=480');
     a.document.open("text/html");
     a.document.write("<html><head></head><body>");

     // Scrivo il titolo e il corpo con un pò di stile in CSS
     a.document.write("<div style='border: 1px solid #CCCCCC'>"+titolo+"</div>
");
     a.document.write("</body></html>");
     a.document.close();

     // Invio il documento alla stampante
     a.print();
}
</script>

mentre l'html è

codice:

<div id='titolo_articolo'>Articolo di Esempio</div>
<input type='button' value='Stampa1' onClick='Stampa("titolo_articolo")' />


<div id='corpo_articolo'>
Questo è il testo dell'articolo di esempio...

C'è scritto qualcosa che parla di qualcosa...
</div>
<input type='button' value='Stampa2' onClick='Stampa("corpo_articolo")' />

il mio obiettivo è che cliccando sul tasto stampa1 possa stampare "Articolo di esempio"
se clicco Stampa2 possa stamapre "Questo è il testo dell'articolo di esempio..."

grazie per la pazienza!

**Xinod** · 05-04-2012, 21:45

devi solo togliere gli apici attorno a idDiv qui
var titolo = document.getElementById('idDiv').innerHTML;

**mtk-kun** · 05-04-2012, 21:54

perfetto ho provato e funziona alla grande,

ho fatto una prova e funziona scrivendo anche solo id cosi:

codice:

var titolo = document.getElementById(id).innerHTML;

ti ringrazio tantissimo per l'aiuto!

Discussione: Stampa del contenuto di un div tramite javascript

Strumenti discussione

Ricerca discussione

Visualizza

Stampa del contenuto di un div tramite javascript

Permessi di invio