前端连接打印机批量打印pdf格式的文件

Question

前端连接打印机批量打印pdf格式的文件

发布于
2019-06-05

求教

<!DOCTYPE html>
<html>
<head lang="en">

<meta charset="UTF-8">
<script language="javascript" src="./util/LodopFuncs.js"></script>
<object  id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0> 
    <embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0></embed>
</object>
<style>
    * {
        padding: 0;
        margin: 0;
    }
    .wrap {
        width: 300px;
        margin: 100px auto 0;
    }
    table {
        border-collapse: collapse;
        border-spacing: 0;
        border: 1px solid #c0c0c0;
    }
    th,
    td {
        border: 1px solid #d0d0d0;
        color: #404060;
        padding: 10px;
    }
    th {
        background-color: #09c;
        font: bold 16px "微软雅黑";
        color: #fff;
    }
    td {
        font: 14px "微软雅黑";
    }
    tbody tr {
        background-color: #f0f0f0;
    }
    tbody tr:hover {
        cursor: pointer;
        background-color: #fafafa;
    }
</style>

</head>
<body>
<div class="wrap">

<button id="dy">批量打印</button>
<table>
    <thead>
    <tr>
        <th>
            <input type="checkbox" id="j_cbAll" />
        </th>
        <th>节日</th>
        <th>月份</th>
    </tr>
    </thead>
    <tbody id="j_tb">
    <tr class="usePrint">
        <td>
            <input type="checkbox" />
        </td>
        <td>春节</td>
        <td>1.1</td>
    </tr>
    <tr class="usePrint">
        <td>
            <input type="checkbox" />
        </td>
        <td>劳动节</td>
        <td>5.1</td>
    </tr>
    <tr class="usePrint">
        <td>
            <input type="checkbox" />
        </td>
        <td>儿童节</td>
        <td>6.1</td>
    </tr>
    <tr class="usePrint">
        <td>
            <input type="checkbox" />
        </td>
        <td>国庆</td>
        <td>10.1</td>
    </tr>
    </tbody>
</table>

</div>
<script src="https://cdn.bootcss.com/jquer...;></script>
<script src="./util/pdfobject.js"></script>
<script>

$(function () {
    
    $("#j_cbAll").click(function () {
       
        var isChecked = $("#j_cbAll").prop("checked");
        $("#j_tb input").prop("checked", isChecked);
    });
    $("#j_tb input").click(function () {
        var allLength = $("#j_tb input").length;
        var checkedLength = $("#j_tb input:checked").length;
        if(allLength == checkedLength){
            $("#j_cbAll").prop("checked",true);
        }else {
            $("#j_cbAll").prop("checked",false);
        }
    });
    function creatTB(){
        var printHtml = "";
        for(i=0;i<$("#j_tb input:checked").parents('.usePrint').length;i++) {
            printHtml = printHtml + '<img src="./images/rz.png">';       
        }
        return printHtml;
    }
    function  print(){
        LODOP=getLodop();  
        var wenben=['<img src="./images/rz.png">','<img src="./images/20161014174841588.png">'];
        for (i=0;i<wenben.length;i++)
        {                 
            LODOP.PRINT_INIT("");//初始化在循环中
            LODOP.ADD_PRINT_IMAGE(0,0,"100%","100%",wenben[i]);
            LODOP.SET_PRINT_STYLEA(0,"Stretch",2);//按原图比例(不变形)缩放模式 
            LODOP.PRINT(); 
            window.console && console.log(i);
            alert(i)
        }
    }
    $("#dy").click(function(){
        // var printHtml= creatTB();
        //     newWindow = window.open("",'newwindow');
        //    newWindow.document.body.innerHTML = printHtml;
        //    newWindow.print();
        // var printHtml = creatTB()
        // LODOP=getLodop();      
        // LODOP.PRINT_INIT("打印常用证明3");
        // LODOP.ADD_PRINT_IMAGE(0,0,"100%","100%",printHtml);
        // LODOP.SET_PRINT_STYLEA(0,"Stretch",2);//按原图比例(不变形)缩放模式
        // LODOP.PRINT();    
        setTimeout(function(){
            print()
        },500); 
    })


});

</script>
</body>
</html>

试了这种的好像只能打印图片换成pdf就不好使了求教

javascript html

阅读 6.6k

1 个回答

楼主，参考下这个库Print.js

撰写回答