2013-07-19 7 views
11

Ho questa funzione per il mio plugin Wordpress utilizza jQuery che stampa il contenuto dal div con classe "table_disp". Come posso stampare lo stile css insieme ad esso.jQuery Stampa la funzione per stampare il contenuto div con css

function pop_print(){ 
    w=window.open(null, 'Print_Page', 'scrollbars=yes');   
    w.document.write(jQuery('.table_disp').html()); 
    w.document.close(); 
    w.print(); 
} 

Qualche idea?

+0

Vuoi dire come $ ('# item'). Css (' colore', '# 999999'); ? –

+0

Devo usare qualcosa del genere .. w.document.write (jQuery ('. Table_disp'). Css ('color', '# 999999'). Html()); –

risposta

9

È necessario includere il foglio di stile SAME che si sta utilizzando nella pagina padre all'interno del pop-up. Si consiglia di creare uno stub/wrapper di pagina fittizio contenente il foglio di stile, quindi iniettare il codice HTML.

var myStyle = '<link rel="stylesheet" href="http://mysite.com/mystyle.css" />'; 
w.document.write(myStyle + jQuery('.table_disp').html()); 
+1

Puoi per favore elaborarlo con un esempio usando la mia funzione. –

+0

Ho apportato una modifica per includere questo codice. –

+0

Potrebbe essere stato utile se si trattasse di un normale sito web. Dal momento che sto usando WordPress è diverso per accodare il foglio di stile. Se mi piace, mi indirizza nuovamente verso un'altra pagina che non esiste. :( –

1

se è possibile aggiungere un plugin, il plugin Jquery printThis grandi opere (in quanto si sta già utilizzando jQuery), e fa esattamente quello che ti serve. http://plugins.jquery.com/printThis/

Si fa un iframe e usa la tua pagina CSS, più consente un file css aggiuntivo specifico per la stampa, insieme ad altre cose

3
function PrintElem(elem) { 
    Popup(jQuery(elem).html()); 
} 

function Popup(data) { 
    var mywindow = window.open('', 'my div', 'height=400,width=600'); 
    mywindow.document.write('<html><head><title></title>'); 
    mywindow.document.write('<link rel="stylesheet" href="http://www.test.com/style.css" type="text/css" />'); 
    mywindow.document.write('<style type="text/css">.test { color:red; } </style></head><body>'); 
    mywindow.document.write(data); 
    mywindow.document.write('</body></html>'); 
    mywindow.document.close(); 
    mywindow.print();       
} 

<a href="#" id="hrefPrint" onclick="PrintElem('.print_div')">Print</a> 
Problemi correlati