• 使用window.print()实现网页打印


     1 <!DOCTYPE html>
     2 <html lang="en">
     3 
     4 <head>
     5     <meta charset="UTF-8">
     6     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     7     <title>Document</title>
     8     <style type=”text/css” media=”print”>
     9         #button {
    10             display: none;
    11         }
    12     </style>   
    13 </head>
    14 
    15 <body>
    16     <button id=”button” onclick="qrprint()">打印</button>
    17     <table id=”tab_1” style="page-break-after: always;">
    18         <tr>
    19             <td><span>这是内容1</span></td>
    20             <td><span>这是内容2</span></td>
    21             <td><span>这是内容3</span></td>
    22         </tr>
    23         <tr>
    24             <td><span>这是内容4</span></td>
    25             <td><span>这是内容5</span></td>
    26             <td><span>这是内容6</span></td>
    27         </tr>
    28     </table>
    29     <table id=”tab_2” style="page-break-after: always;">
    30         <tr>
    31             <td><span>这是内容7</span></td>
    32             <td><span>这是内容8</span></td>
    33             <td><span>这是内容9</span></td>
    34         </tr>
    35         </tr>
    36           <td><span>这是内容10</span></td>
    37           <td><span>这是内容11</span></td>
    38           <td><span>这是内容12</span></td>
    39         </tr>
    40     </table>
    41     <script>
    42         function qrprint() {
    43             window.print();//打开当前页面
    44             window.close();//关闭当前页面
    45         }
    46     </script>
    47 </body>
    48 </html>

    注:style设置为page-break-after:always可以实现分页,可参考w3chool或者菜鸟等其它进行了解

    参考链接:https://www.cnblogs.com/qiankun-site/p/5814038.html

  • 相关阅读:
    matlab的两种函数简单使用介绍
    有关水晶易表的使用
    有关navicat11版本的破解
    关于配置javaee过程中的问题
    svn在服务器配置安装过程中的问题
    数据挖掘一
    javaee版eclipse导包出现未找到类问题
    git常用命名行总结
    学习kafka的基本信息总结
    JQuery之事件冒泡
  • 原文地址:https://www.cnblogs.com/nongfusanquan/p/12421064.html
Copyright © 2020-2023  润新知