zoukankan      html  css  js  c++  java
  • Js通过window.print();实现打印

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>消费记录PDF</title>
    <script type="text/javascript">   
        function doPrint() {    
            bdhtml=window.document.body.innerHTML;    
            sprnstr="<!--startprint-->";    
            eprnstr="<!--endprint-->";    
            prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+10);    
            prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));    
            window.document.body.innerHTML=prnhtml; 
            window.print();    
    }    
    </script>
    </head>
     
    <body>
    
    <!--startprint--><!--注意要加上html里star和end的这两个标记-->
    <div>
        <table style="border: #F0F8FF 1px solid">
            <tr>
                <td style=" 300px;height: 25px;background-color: #FF4500;">用户名称:</td>
                <td style=" 300px;height: 25px;background-color: #FF4500;">萧薰儿</td>
            </tr>
            <tr>
                <td style=" 300px;height: 25px;background-color: #FF4500;">客户类型:</td>
                <td style=" 300px;height: 25px;background-color: #FF4500;">SVIP</td>
            </tr>
            <tr>
                <td style=" 300px;height: 25px;background-color: #FF4500;">本次消费金额:</td>
                <td style=" 300px;height: 25px;background-color: #FF4500;">6000.00</td>
            </tr>
            <tr>
                <td style=" 300px;height: 25px;background-color: #FF4500;">本次支付方式:</td>
                <td style=" 300px;height: 25px;background-color: #FF4500;">移动支付</td>
            </tr>
            <tr>
                <td style=" 300px;height: 25px;background-color: #FF4500;">本次消费时间:</td>
                <td style=" 300px;height: 25px;background-color: #FF4500;">2018-11-30 17:00:00</td>
            </tr>
        </table>
    </div>
    <!--endprint-->
    <button type="button" onclick="doPrint()">打印</button>
    
    </body>
    </html>

    转自:

    https://blog.csdn.net/yongchao940/article/details/73129425/

    往事如烟,余生有我.
  • 相关阅读:
    Angular2 组件通信
    vue跨组件通信的几种方法
    Angular React 和 Vue的比较
    vue对比其他框架
    ReactJS 生命周期、数据流与事件
    LeetCode 1089. 复写零(Duplicate Zeros) 72
    LeetCode 421. 数组中两个数的最大异或值(Maximum XOR of Two Numbers in an Array) 71
    12
    11
    10
  • 原文地址:https://www.cnblogs.com/assistants/p/10045343.html
Copyright © 2011-2022 走看看