web print window.print of introduction

  • 2020-05-10 18:41:15
  • OfStack

  I only give more effective, convenient to print method, some WEB print is calls ActiveX controls, this requires the user to modify their IE browser Internet ActiveX option in safety, will enable them all, some trouble, turn over the network, the following method can be directly printed, rather than modifying IE Internet options.

window.print is used to print the page. Other elements on the page are also printed, and the format of the header and footer is not easy to control.
The & # 8226; Common approach: most cases will bind the results of a query to DataGrid and print DataGrid. In this case, the format of print 1 is generally fixed and simple, and it will not be changed after confirmation. So you can use IE to print directly.

[instance code]
Note: this is the client through window. print print specified content. sprnstr and eprnstr are defined here to specify content
        execution code:

     
<input type="button" name="print" value="//www.ofstack.com/yc1990/archive/2012/03/03/ Preview and print " onclick="preview()">
     
If you use window directly, print will print everything on the page, but we can use it
< style > @media Print { .Noprn { DISPLAY: none }}
Is used to specify what is not printed.


<script language="Javascript">
function preview()
{
    bdhtml=window.document.body.innerHTML;
    sprnstr="<!--startprint-->";
    eprnstr="<!--endprint-->";
    prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17);
    prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));
    window.document.body.innerHTML=prnhtml;
    window.print();
}
</script>
<!-- Omitted code -->
<form id="WebForm1" method="post" runat="server">
     <center> This section is not printed above </center>
     <!--startprint-->
     <div align="center">
         <asp:DataGrid id="dgShow" runat="server">
              <!-- Omitted code -->
         </asp:DataGrid>
     </div>
     <!--endprint-->
     <center> This section is not printed below </center>
     <div align="center">
         <input type="button" name="print" value="//www.ofstack.com/yc1990/archive/2012/03/03/ Preview and print " onclick="preview()">
     </div>
     <style> @media Print { .Noprn { DISPLAY: none }}
     </style>
     <p class="Noprn"> Don't print </p>
     <table id="datagrid">
         <tr>
              <td> print </td>
         </tr>
     </table>
     <input class="Noprn" type="button" onclick="window.print()" value="//www.ofstack.com/yc1990/archive/2012/03/03/print">
</form>

The main sentence of       is:

<input class="Noprn" type="button" onclick="window.print()" value="//www.ofstack.com/yc1990/archive/2012/03/03/print">

      can be printed this way, and by setting the CSS property, it will be easy to control what needs to be printed and what does not, without additional header and page number information.


Related articles: