侧边栏壁纸
博主头像
落叶人生博主等级

走进秋风,寻找秋天的落叶

  • 累计撰写 130562 篇文章
  • 累计创建 28 个标签
  • 累计收到 9 条评论
标签搜索

目 录CONTENT

文章目录

一种基于浏览器的自动小票机打印实现方案

2024-05-06 星期一 / 0 评论 / 0 点赞 / 63 阅读 / 9709 字

1、使用场景 用户在浏览器做了某项操作后,自动打印小票。2、测试方式 2.1 JavaScript实现 尝试了很多办法,最终都会出现一个弹出框,让用户选择打印机。不符合我们需求。 2

1、使用场景

 用户在浏览器做了某项操作后,自动打印小票。

2、测试方式

  2.1 JavaScript实现        尝试了很多办法,最终都会出现一个弹出框,让用户选择打印机。不符合我们需求。  2.2 lodop        功能比较强大,但是收费的。暂不考虑。  2.3 PAZU        功能也很强大,免费许可。非常赞!        详情:http://www.4fang.net/article/tech/pazu_tprinter.html

实现过程:

 2.3.1 打印详情页面
<!doctype html><html><head><meta charset="utf-8"><title>小票</title><style>body {    margin: 0px;    padding: 0px;    font-size: 11px;}hr{width: 100%; border: 1px dashed black;}/*****************    小票*****************/.table .title{    font-size:14px;    }.table{    width:100%;    }.table .left{    text-align:right;    }</style></head><body>    <table class="table">        <tr>            <td align="center" class="title">ABC学校</td>        </tr>        <tr>            <td align="center">小票</td>        </tr>        <tr>            <td><hr size="1" /></td>        </tr>    </table>    <table class="table">        <caption>            <col style="width:40%">            <col style="width:60%">        </caption>        <tbody>            <tr>                <td class="left">签到时间:</td>                <td class="right">2015年10月19日   15:30</td>            </tr>            <tr>                <td class="left">学员姓名:</td>                <td class="right">周深</td>            </tr>            <tr>                <td class="left">班级:</td>                <td class="right">少儿班</td>            </tr>            <tr>                <td class="left">学校名称:</td>                <td class="right">ABC学院</td>            </tr>            <tr>                <td colspan="2"><hr size="1" /></td>            </tr>        </tbody>    </table>    <table class="table">        <caption>            <col style="width:40%">            <col style="width:60%">        </caption>        <tbody>            <tr>                <td class="left">卡信息:</td>                <td class="right">季卡/60次</td>            </tr>            <tr>                <td class="left">卡余额:</td>                <td class="right">32次</td>            </tr>            <tr>                <td class="left">到期日期:</td>                <td class="right">无限期</td>            </tr>            <tr>                <td class="left">激活日期:</td>                <td class="right">2015-09-08</td>            </tr>            <tr>                <td colspan="2"><hr size="1" /></td>            </tr>        </tbody>    </table>    <table class="table">        <tr>            <td align="center">感谢您的惠顾!<br/>请保管好小票,如有问题,请出示,谢谢!</td>        </tr>        <tr>            <td align="center"><img src="code.png" class="code"/><br/>扫码查详情</td>        </tr>     </table></body></html>

  2.3.2 业务页面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head lang="en">    <meta charset="UTF-8">    <title></title>    <script src="printReceipt.js"></script></head> <body> <iframe frameborder="0" scrolling="scrolling" src="receipt.html" name="myifrm" id="myifrm" style="height: 0;width: 323px;"></iframe><input class="p__" name="Button1" type="button" value="打印试试!" onclick="print(1);" style="width: 301px"/>  </body><script>    initPrintActiveX();</script></html>

  2.3.3 js引入

function initPrintActiveX(){    var div_ = document.createElement('div');    div_.style="display:none";     var object_=document.createElement('object');    object_.setAttribute("classid","clsid:AF33188F-6656-4549-99A6-E394F0CE4EA4");    object_.setAttribute("codebase","http://www.4Fang.net/4ff/sc_setup.exe");    object_.setAttribute("id","pazu");    object_.setAttribute("name","pazu");      var param_=document.createElement('param');    param_.setAttribute("name","License");    param_.setAttribute("value","2AE816BA3A24A9BA3F01162E7BF420F4");    object_.appendChild(param_);    div_.appendChild(object_);    document.getElementsByTagName("body")[0].appendChild(div_);  }//预先选中的纸张var strDefaultPaper = 'A4';//1.载入打印机和纸张列表function init() {    listPrinters();    //listPapers();    //2.页面载入立即打印    //demo();} //列出所有的打印机function listPrinters() {    var ps = pazu.TPrinter.getPrinters();    //获得是一个以回车换行分隔的字符串    // alert(ps);    var pa = ps.split("/r/n");    for (var i = 0; i < pa.length; i++) {        //alert(pa[i]);        var Op = document.createElement("option");        Op.text = pa[i];        Op.value = pa[i];        try {            printers.add(Op);        } catch (ex) {            alert(ex.message)        }    }}function print(num) {    /*跳过IE打印选择提示*/    //默认打印机的名称设置为:GP-58120 Series    var isPromtUser = false;    /*页面设置*/    var sPaper = "A4";//  var sPrinter = printers.value;    var sPrinter = "GP-58120 Series";    pazu.TPrinter.marginTop = 1;                    //属性 上边距    pazu.TPrinter.marginBottom = 14;                 //属性 下边距    pazu.TPrinter.marginLeft = 7;                   //属性  左边距    pazu.TPrinter.marginRight = 8;                  //属性  右边距    pazu.TPrinter.footer = "";                  //属性 页脚    pazu.TPrinter.header = "";                  //属性  页眉    pazu.TPrinter.orientation = 1;                   //属性 整型:纸张方向 1=纵向  2=横向    pazu.TPrinter.paperName = sPaper;                //属性   纸张大小名称    pazu.TPrinter.printerName = sPrinter;            //属性   打印机名称    pazu.TPrinter.isPrintBackground = false;    //属性  是否打印背景 true / false    pazu.TPrinter.isZoomOutToFit = true;           //属性   是否缩放以适应大小打印 true / false    //pazu.TPrinter.printTemplate = sPT;                 //属性   打印模板的URL    pazu.TPrinter.copies = num;               //属性   打印份数    //pazu.TPrinter.range = range.value;                 //属性   页面范围    pazu.TPrinter.isCopyByCopy = false; //属性    是否整份打印结束后再打印下一份 true / false    //pazu.TPrinter.getDefaultPrinter          //方法    获得默认打印机的对象    //pazu.TPrinter.printToDefaultPrinter      //方法  把要打印的字符串输送到默认打印机(配合getDefaultPrinter 使用)    //pazu.TPrinter.getPaperForms              //方法    返回所有纸张格式的列表,以vbCrlf 分割    //pazu.TPrinter.getPrinters                //方法    返回一个打印机列表,以vbCrlf 分割    //pazu.TPrinter.createPaper           //方法    按指定的宽度和高度创建自定义纸张 请看示例    //pazu.TPrinter.doPrint                    //方法    执行打印    //pazu.TPrinter.doPrint_                   //方法    执行打印但是不进行页面参数设置    //pazu.TPrinter.doPreview                  //方法    打印预览    //pazu.TPrinter.doPageSetup                //方法    执行页面参数的设置    //pazu.TPrinter.showPageSetup              //方法    弹出页面设置窗口    //pazu.TPrinter.writeHTMLtoOfficeFile  方法   把HTML导出为Office EXCEL或者 Word格式文件     //要指定打印那个Frame只要用javascript 让那个Frame获得焦点就可以了    //注意:这种方式下是不能预览的,只能立即打印。否则预览看到的是整个网页,而不是指定的frame    window.frames['myifrm'].focus();     //pazu.TPrinter.doPreview();//打印预览     pazu.TPrinter.doPrint(isPromtUser);  } String.prototype.trim = function () {    return this.replace(/(^/s*)|(/s*$)/g, "");}function isNum(n) {    if (isNaN(n))return false;    return true;}

广告 广告

评论区