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/

    往事如烟,余生有我.
  • 相关阅读:
    angular模板
    Growth: 全栈增长工程师指南
    全栈增长工程师实战
    vue 快速搭建项目 iview
    ng-style
    教程视频链接
    内置对象
    对象—封装、继承
    对象—构造函数
    函数-理论
  • 原文地址:https://www.cnblogs.com/assistants/p/10045343.html
Copyright © 2011-2022 走看看