js打印-优快云博客

本文介绍了一种使用JavaScript和HTML实现的网页局部打印方法。通过定义打印范围，可以仅打印页面中特定部分的内容，同时避免打印不必要的区域，如导航栏或底部版权信息等。此方法适用于需要精确控制打印内容的场景。

function preview()
  {
  bdhtml=window.document.body.innerHTML;
  sprnstr="";
  eprnstr="";
  prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17);
  prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));
  window.document.body.innerHTML=prnhtml;
  window.print();
  }

<form id="WebForm1" method="post" runat="server">
   <center>本部分以上不被打印</center>
   
   <div align="center">
    <asp:DataGrid id="dgShow" runat="server" BorderColor="#CC9966" BorderStyle="None" BorderWidth="1px" BackColor="White" CellPadding="4">
     <SelectedItemStyle Font-Bold="True" ForeColor="#663399" BackColor="#FFCC66"></SelectedItemStyle>
     <ItemStyle ForeColor="#330099" BackColor="White"></ItemStyle>
     <HeaderStyle Font-Bold="True" ForeColor="#FFFFCC" BackColor="#990000"></HeaderStyle>
     <FooterStyle ForeColor="#330099" BackColor="#FFFFCC"></FooterStyle>
     <PagerStyle HorizontalAlign="Center" ForeColor="#330099" BackColor="#FFFFCC"></PagerStyle>
    </asp:DataGrid>
   </div>
   
   <center>本部分以下不被打印</center>
   <div align="center">
    <input type="button" name="print" value="预览并打印" onclick="preview()">
   </div>
   <style> @media Print { .Noprn { DISPLAY: none }}
   </style>
   <p class="Noprn">不打印</p>
   <table id="datagrid">
    <tr>
     <td>打印</td>
    </tr>
   </table>
   <input class="Noprn" type="button" onclick="window.print()" value="print">
  </form>