Question

我在网页上添加了3个打印按钮，每个按钮都打印了网页的一部分（div）。这是

的代码

function printPage(id)
{
   var html="<html>";
   //html+="<link rel="stylesheet" type="text/css" href="../css/template.css" />";
   html+= document.getElementById(id).innerHTML;
   html+="</html>";

   var printWin = window.open('','_blank','left=0,top=0,width=500,height=500,fullscreen=1,toolbar=0,scrollbars=0,status  =0');
   printWin.document.write(html);
   printWin.document.close();
   printWin.focus();
   printWin.print();
   printWin.close();
}


 <input name="b_print" type="button" class="ipt"   onClick="printPage('one');" value="Print One">
<input name="b_print" type="button" class="ipt"   onClick="printPage('two');" value="Print Two">
<input name="b_print" type="button" class="ipt"   onClick="printPage('three');" value="Print three">

因此，当我点击“打印”按钮时，会打开一个新窗口，成功打印并关闭它。我对此很少有疑问

首先，我想在同一页面中弹出打印窗口。为此，我已使用_blank替换window.open中的_parent属性，但在打印后，页面不会重定向或返回到我已启动打印的页面。怎么避免这个？

其次，如何控制打印页面的样式？我试图链接一个样式表（如上面的代码所示）但它不起作用。

提前感谢您的任何帮助或建议

function printPage(printpage)
                {
                    var headstr = '<html><head></head>'+'<link rel="stylesheet" type="text/css" href="../css/template.css" />'+'<body><br/><br/><br/>';
                    var footstr = "</body>";
                    var newstr = document.all.item(printpage).innerHTML;
                    var oldstr = document.body.innerHTML;
                    document.body.innerHTML = headstr+newstr+footstr;                   
                    window.print();
                    document.body.innerHTML = oldstr;
                    return false;
                }

Answer 1

您可以使用隐藏的Iframe，而不是使用弹出窗口。这将使事情保持在“同一页面”。创建一个已经包含样式表路径的虚拟页面“print.html”。如果您有正确的路径，它将起作用。

在打印虚拟页面中，创建一个从父页面获取HTML内容的函数（在本例中为一个名为HTMLStuff的字符串），然后自行打印：

<iframe id="printf" src="print.html" name="printf"></iframe>

document.body.innerHTML = parent.htmlStuff;
window.print()

您可以设置iframe的SRC并制作抓取不同内容的不同网页。还有其他方法可以做到这一点，但这很简单。

Answer 2

要在渲染页面进行打印时应用样式表的一部分，可以使用：

@media print {    
    /*
    Your css here
    */
}

如何控制打印页面的样式？

2 个答案: