2012-06-07 1 views
5

[versione semplificata di questa domanda:]iFrame problemi di stampa

Perché iFrames a volte si rifiutano di stampare? Per esempio, ha colpito print preview su queste due pagine:

  1. http://fiddle.jshell.net/gJDv4/1/show/
  2. http://fiddle.jshell.net/gJDv4/2/show/

On anteprima di stampa, gli iFrame sono visibili nel primo esempio, ma nascosto nel secondo. La differenza di codice SOLO tra first e second iFrames è una proprietà CSS (margin: 20px;) è stata aggiunta agli iFrame nel secondo esempio.


[versione lunga (originale):]

Sto costruendo una pagina di anteprima/stampa che assembla un gruppo di file HTML indipendenti riferimento proprio stile schede tecniche e javascript file.

L'idea è che tutti i file vengono visualizzati in iFrame per l'anteprima, e poi una volta stampate, ogni iFrame (che probabilmente si estenderà su più pagine) stampa come se si trattasse di un proprio documento .

Tuttavia, quando stampo (o anteprima di stampa) gli iFrame non mostrano alcun contenuto, o stampano solo la prima pagina, troncando le pagine restanti di iFrame.

I iFrame stampati (e di stampa in anteprima) bene prima ho fatto loro più pagine:

Qual è il motivo di questo comportamento?

+0

Hehe, dubito che ci sia una soluzione ma io farò +1 a chi riesce a farlo funzionare correttamente: p E +1 per spendere il rappresentante su di esso per ottenere risposte pur avendo quel piccolo te stesso. :) – sg3s

+0

Se non c'è una risposta vera, sicuramente meriti la grazia per averlo riconosciuto subito. ;) – brentonstrine

risposta

3

È possibile stampare i documenti nei singoli iframe chiamando la funzione print() sulle loro finestre ....

Quindi qualcosa di simile per stampare file di 2:

$('#iframeTwo')[0].contentWindow.print() 

E qui un jsfiddle dove ho aggiunto i pulsanti che attivano le singole stampe ...

http://jsfiddle.net/sg3s/GJKkm/17/

per quanto riguarda il motivo per cui il browser fare non è possibile stampare il contenuto all'interno degli iframe durante la stampa del documento principale. Probabilmente deve fare qualcosa con il fatto che quei documenti non sono in realtà parte del documento in cui sono mostrati in ...Pensalo come una finestra separata (una che puoi generare con window.open() in js) ma poi abilmente intaccata nel documento principale con la finestra limitata a qualsiasi cosa venga specificata sull'iframe con un po 'di magia.

+0

Il problema con la stampa degli iframe individualmente è che apre la possibilità che un lavoro di stampa di qualcun altro finisca tra due dei file HTML da stampare, poiché (presumo) entrerebbero nella coda di stampa come lavori di stampa separati . La spiegazione sul motivo per cui il contenuto non viene visualizzato è quello che stavo indovinando, ma c'è ancora il problema che iFrame DO si presentano quando non si traboccano su una pagina separata! – brentonstrine

+0

Se vuoi mantenere i tuoi lavori di stampa insieme, probabilmente è molto meglio mettere insieme i due documenti, facendo molta attenzione a separare gli stili usando le classi ... E sì, quel comportamento è strano, ma se ci pensi è incredibile loro mostrano a tutti ... Probabilmente prova a renderlo come normale html ma dal momento che ci sono limitazioni per incorniciare i bug del contenuto. A proposito, non riesco a riprodurlo in Chrome, quindi se stai cercando di farlo funzionare su cross browser, puoi anche smettere ora: p – sg3s

+0

Per portare i due documenti insieme a diversi fogli di stile. Questo potrebbe richiedere un po 'di lavoro ma probabilmente funzionerebbe; Prendi i due documenti, metti l'html in nodi 'root' separati che identificano i diversi documenti. Ottenere i fogli di stile per i documenti e assemblarli in un pre-compilatore css all'interno di una struttura nidificata (come [LESS] (http://lesscss.org/#-nested-rules)) lasciare che il pre-compilatore faccia il foglio di stile, con i nodi all'interno di un set nidificato che applica gli stili in quel foglio di stile solo al documento pertinente. Includi il foglio di stile generato. Vincere. – sg3s