Print preview is empty. After adding a link to an external stylesheet in a print html content document

I want to print the contents of the DIV on the page. What I am doing is getting the contents of the div using JS and passing it to a new obj window where I call .print (). Text content and images are displayed as such. Just when I add this line to get the contents of the div

<link href="myprintstyle.css" rel="stylesheet" type="text/css"> 

Print preview is empty. I also tried adding other style sheets, the same result. Whatever link to the stylesheet I add to print the contents of html, the same page with a preview of the results. here is my JS code to print the contents of the page.

 var printDivCSS = new String ('<link href="myprintstyle.css" rel="stylesheet" type="text/css">'); function Popup(htmldata) { var mywindow = window.open('test', 'eChallanReceipt', 'height=800,width=800,top=20;left=20'); var str ="<html><head><title>test</title>"; str+= "</head><body>"+ printDivCSS + htmldata+"</body></html>"; mywindow.document.write(str); mywindow.document.close(); // necessary for IE >= 10 mywindow.focus(); // necessary for IE >= 10 mywindow.print(); mywindow.close(); return false; } 

Please suggest some corrections. I want the style of print content. Browser: Chrome

The same code works in Mozilla. But in Chrome, I ran into this problem.

+5
source share
2 answers

I know this is an old question, but for those who have this problem, here is a solution.

Shows a blank page because the document is not finished yet. therefore, to fix this, add mywindow.print() to the timeout .

 var printDivCSS = new String ('<link href="myprintstyle.css" rel="stylesheet" type="text/css">'); function Popup(htmldata) { var mywindow = window.open('test', 'eChallanReceipt', 'height=800,width=800,top=20;left=20'); var str ="<html><head><title>test</title>"; str+= "</head><body>"+ printDivCSS + htmldata+"</body></html>"; mywindow.document.write(str); mywindow.document.close(); // necessary for IE >= 10 $( mywindow.document).ready(function(){ //set this timeout longer if you have many resources to load setTimeout(function(){ mywindow.focus(); mywindow.print(); },1000); return false; } 
+2
source

CSS should be called from the page title, not from the body.

0
source

Source: https://habr.com/ru/post/1240766/


All Articles