Javascript 仅打印网页的一部分

我写了一个代码，它只打印网页的一部分。为此，我使用了

代码如下：

<div id="printme">
    <table width='1000'  align="center">
    <tr><td>
    <h1> CANDIDATE DETAILS</h1>
             -----
             -----
             -----
             -----
</div>
<div id="dnt_print">
    <fieldset>
    <legend> <b>Uploads: </b></legend>
    <table width='900' align="center" >
              ----
              ----
              ----
     <td align="center">
       <input type="button" value="PRINT DETAILS" onclick="printdetails()">
     </td>
 </div>

function printdetails()
{
    alert("Allow Pop-ups");
    var myWindow=window.open('','','width=200,height=100');
    var x=document.getElementById("printme").innerHTML;
    myWindow.document.write(x);
    myWindow.print();
    myWindow.close();
}

---

但问题是，当我单击打印时，弹出的新窗口显示完整的详细信息，而不仅仅是

--

的

内部HTML

！！请帮助我，不要让它变得复杂，而是使用值

hidden

/

visible

来使用元素的

可见性
CSS属性。这就是我们如何打印网页的特定部分

它还包括如何在打印输出页面中实现css和javascript

同样对于页面的多个部分，您可以应用“
”标记，正如我在下面实现的那样

<script type="text/javascript">
function printCommission() {
    // For logo html (part 1 for print out)
    var prtContent = document.getElementById("logo");

    // This is the div I was required to include in print out (part 2 for print out)    
    var prtContent1 = document.getElementById("dashboardbody1");

    var WinPrint = window.open('', '', 'letf=0,top=0,width=800,height=900,toolbar=0,scrollbars=0,status=0');

    // To apply css  
    WinPrint.document.write("<style> .commission td, .commission th {border-color: #CCCCCC;padding: 4px;}  .commission th {background-color: #106C9B;border-color: #CCCCCC;color: #FFFFFF;} .commission { border-collapse: collapse; color: #000000; text-align: center; } .commission td.td-noborder { border: 1px solid #FFFFFF;} .bg-grey {    background: none repeat scroll 0 0 #CCCCCC;} .bold {    font-weight: bold !important;}</style>");

    WinPrint.document.write(prtContent.innerHTML + "<br><br>" + prtContent1.innerHTML);

    // to apply javascript (I used it to hide buttons) 
    WinPrint.document.write("<script type='text/javascript'>" + " window.onload=function(){ document.getElementById('downloadReport').style.display='none'; document.getElementById('printout').style.display='none'; document.getElementById('imgCommission').style.display='none';}; <" + "/" + "script>");

    WinPrint.document.close();
    WinPrint.focus();
    WinPrint.print();
    WinPrint.close();
    return false;
}


职能委员会（）{
//用于标识html（第1部分用于打印）
var prtContent=document.getElementById（“徽标”）；
//这是我要求在打印输出中包含的div（打印输出的第2部分）
var prtContent1=document.getElementById（“dashboardbody1”）；
var WinPrint=window.open（“”，’letf=0，top=0，width=800，height=900，toolbar=0，scrollbars=0，status=0’）；
//应用css
WinPrint.document.write（“.commission td，.commission th{边框颜色：#CCCCCC；填充：4px；}.commission th{背景颜色：#106C9B；边框颜色：#CCCCCC；颜色：#FFFFFF；}.commission{边框折叠：折叠；颜色：#000000；文本对齐：中心；}.commission td-noborder{边框：1px实心#ffffffff；}.bg{背景：无重复滚动0#CCCCCC；}。粗体{字体重量：粗体！重要；}）；
WinPrint.document.write（prtContent.innerHTML+“

”+prtContent1.innerHTML）；
//应用javascript（我用它来隐藏按钮）
WinPrint.document.write（“+”window.onload=function（）{document.getElementById（'downloadReport'）.style.display='none'；document.getElementById（'printout'）.style.display='none'；}；”；
WinPrint.document.close（）；
WinPrint.focus（）；
print.print（）；
WinPrint.close（）；
返回false；
}

控制台上有JavaScript错误吗？没有！我可以得到输出！但是对于完整的页面@imulsion，您应该使用CSS媒体规则。您的带有innerHTML的div包含整个表。在打印之前添加
myWindow.focus（）
。我会使用
显示：无
，但我支持此操作。（澄清OP是否不知道：您可以设置特定于媒体的CSS，因此可以将其放入
media=print
脚本中）我在这个问题上投了a-1，这是因为我个人不喜欢不回答问题的答案，而只是提供替代解决方案。这些答案应该是评论。我只是写了答案而不是评论，因为我想如果这个ans帮助OP解决了他的问题，那一定是答案。对不起，如果我错了.您可以标记此答案。