Stampa di più pagine con Javascript

Question

Ho un sito Web in cui gli utenti fanno clic su un pulsante di lettura in più in modo che possano visualizzare il resto delle informazioni sulla pagina. Sono curioso di sapere come potrei fare in modo che gli utenti non debbano stampare separatamente ogni pagina. Mi piacerebbe essere in grado di farlo in modo da avere uno script che stampa le pagine correlate. Se qualcuno potesse aiutarmi e indirizzarmi nella giusta direzione, sarebbe molto apprezzato. Ho bisogno di questa funzionalità per funzionare su tutti i browser.

Grazie

Answer 1

Ciò che è necessario rimuovere è un foglio di stile che utilizza gli stili di supporto. È fondamentalmente come avere due fogli di stile separati; uno per la stampa e uno per la visualizzazione. Per essere conservatore della larghezza di banda, lasciare lo printarea vuoto finché non viene effettuata la richiesta. Nell'evento richiesta compilare lo printarea con l'intera stampa che si desidera fare. Ti suggerirei di esaminare jQuery e il loro carico e le richieste ajax per questo.

@media screen 
    { 
    #screenarea 
     { 
     display: block; 
     } 
    #printarea 
     { 
     display: none; 
     } 
    } 
@media print 
    { 
    #screenarea 
     { 
     display: none; 
     } 
    #printarea 
     { 
     display: block; 
     } 
    } 

Answer 2

mia sensazione prima mi ha detto che sarebbe necessaria una soluzione basata su server, perché la funzione window.print stampa solo ciò che è nel documento corrente, e che si dovrebbe scrivere il codice del server per la produzione di una pagina web composto da tutte le pagine che si desidera stampare e richiamare window.print da quella pagina.

Ma potresti far funzionare jQuery per te, scaricando le pagine da stampare utilizzando la funzione .load e dopo che tutte le pagine sono state caricate, invoca window.print. Se non puoi usare jQuery per qualche motivo, puoi scrivere tu stesso l'intero impianto idraulico usando XHR.

È difficile fornire una risposta più dettagliata senza disporre di informazioni sulla struttura della propria app Web.

Answer 3

penso che è possibile stampare su un iframe all'interno di uno strato

tihs è un esempio (non molto bello, ma funziona per l'idea):

http://www.fffast.com/scripts/script_iframing.shtml

Answer 4

In in generale, non useresti JavaScript per accedere a più pagine e stamparle. (Se è anche possibile, sembra che sarebbe un po 'un trucco.)

Invece, probabilmente vorrai avere una pagina che contenga tutte le informazioni da stampare, in stile CSS per printability, che l'utente avrebbe visualizzato ed essere in grado di stampare. (In questo caso è possibile utilizzare facilmente JavaScript per avviare l'azione di stampa.)

Forse un collegamento "stampa tutto" che indirizza l'utente a una pagina (o apre una pagina in un nuovo target) che contiene tutte le informazioni da stampare?

Si potrebbe anche fare un ulteriore passo avanti e renderlo un po 'più dinamico. Forse sono presenti delle checkbox accanto alle intestazioni per ogni sezione di informazioni e un pulsante per "print selected" che invierà le selezioni al server e renderà solo le informazioni selezionate alla pagina "print all".

Mi sembra che, come utente, questo avrebbe aderito di più a least astonishment di qualcosa che stampa cose che non ho nemmeno scaricato in primo luogo (dove si corre anche il rischio di inviare troppo alla stampante di un utente e sprecare le loro risorse).

Edit:

Un altro approccio che appena venuto in mente. In primo luogo, tutti i contenuti devono essere in pagine separate? Magari inserisci il contenuto in div s che sono nascosti di default, e il link "leggi di più" mostra il numero associato div. Quindi tutto ciò che serve per la stampabilità è lo stile di supporti CSS di cui sopra. Durante la visualizzazione nel browser, è possibile espandere/comprimere le sezioni di informazioni singolarmente, ma quando la pagina viene stampata, tutto viene ampliato.

Answer 5

Dopo avere tutti i tuoi contenuti in una singola pagina web (utilizzando iniezione o un processo server), la formattazione di pagine utilizza attributi CSS per la stampa @ media, ad esempio:

@media print { 
    h1 {page-break-before: always;} 
} 

Altri attributi sono "PAGE- break-after "e" page-break-inside ", l'ultimo dei quali aiuta ad evitare interruzioni nel contenuto.