Question

我想打印一个页面的DIV内容。我做的是使用JS检索div的内容并将其传递给我调用.print（）的新窗口obj。文本内容和图像显示为这样。就在我将这一行添加到检索到的div内容

时

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

打印预览为空白。我尝试添加其他样式表，结果相同。无论我添加什么样式表参考打印html内容，相同的结果-blank预览页面。这是我的JS代码打印页面内容。

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;
}

请提出一些修正建议。我想要打印内容的样式。浏览器：Chrome

相同的代码在Mozilla中运行。但在Chrome中，我正面临着这个问题。

Answer 1

我知道这是一个老问题，但对于现在遇到此问题的任何人来说，这就是解决方案。

显示空白页面，因为文档尚未完成加载。所以要修复它，请在mywindow.print()中添加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;
}

Answer 2

应该从页面的头部调用CSS，而不是正文。

打印预览为空白在打印html内容中添加外部样式表引用后

2 个答案: