B/S下基于LODOP控件客户端自动打印小票

最新推荐文章于 2021-06-28 17:33:32 发布
最新推荐文章于 2021-06-28 17:33:32 发布
阅读量569 收藏
点赞数
分类专栏： 打印组件

版权声明：本文为博主原创文章，未经博主允许不得转载。

目录(?)[+]

Lodop是一款专业的WEB打印控件，其设计目标是简单易用、功能足够强大，开创WEB打印开发的新局面。

Lodop设计者对WEB下的打印开发任务进行了分类汇总，高度抽象，设计出仅用几个功能函数，就可实现复杂的打印任务，尽量减少使用者的知识累赘。控件发布包有3个系统文件组成，全部功能用几个控件参数和2组功能函数来实现。


Lodop控件下载网址:http://mt.runon.cn/

一、概述

Lodop是一款专业的WEB打印控件，其设计目标是简单易用、功能足够强大，开创WEB打印开发的新局面。

Lodop设计者对WEB下的打印开发任务进行了分类汇总，高度抽象，设计出仅用几个功能函数，就可实现复杂的打印任务，尽量减少使用者的知识累赘。控件发布包有3个系统文件组成，全部功能用几个控件参数和2组功能函数来实现。

    尽管我们有个理想化的目标，那就是您不用详细了解这些参数或函数，仅仅看懂几个样例文件就能很轻松地开始使用本控件，为此Lodop提供了一个足够完善的设计界面，用它可以实现大多数打印开发任务，但事实上了解这些参数和函数总还是有好处的，特别是当您的开发任务很复杂时，这就是本文目的，但愿本文档足够详细且简单明了。

    如果此前曾看过lodop的入门样例程序，本文会更容易理解！

二、系统文件

Lodop发布包内主要有如下几个文件：

install_lodop.exe

该文件是控件安装和升级的主文件，提供给用户或开发者下载安装，如果不特意拦截一般都能100%安装，对“网页插件安装难”有一定改善。如果将其复制或改名为uninstall_lodop.exe (名前加un)就可用其卸载控件。

Lodop安装后，在操作系统Program Files\MountTaiSoftware\Lodop目录下会生成两个实体文件：CAOSOFT_WEB_PRINT_LODOP.OCX和NPCAOSOFT_WEB_PRINT_LODOP.DLL

前一个文件是OCX文件，后者是NPplugin文件，其作用是实现多浏览器支持。目前Lodop支持IE系列、IE内核系列(遨游、360、世界之窗、腾讯TT、搜狗等)浏览器，以及Firefox(火狐)系列、Chrome(谷歌)系列、Opera系列、Safari系列等Windows下几乎所有的浏览器。

安装程序文件有几个预定参数：

-waitXX该参数设置安装程序运行完毕后自动关闭窗口，这里的XX表示关闭前等待的秒数，如果是0秒则安装（或卸载）成功后立即关闭，例如：–wait8

-nowindow 该参数设置安装程序运行时不出现窗口。

-un       该参数使程序执行卸载操作，参数优先于文件名。

-in       该参数使程序执行安装操作，参数优先于文件名。

安装界面如下：

LodopFuncs.js

该文件是用来引导安装控件的一个js文件，是个样例，但建议直接采用。其中getLodop的任务是判断当前浏览器的类型并决定采用哪个对象实例，并检测控件是否安装、是否最新版本、并引导安装或升级。文件内容如下：

function getLodop(oOBJECT,oEMBED){

        var strHtml1="<br><font color='#FF00FF'>打印控件未安装!点击这里<a href='install_lodop.exe'>执行安装</a>,安装后请刷新页面或重新进入。</font>";

        var strHtml2="<br><font color='#FF00FF'>打印控件需要升级!点击这里<a href='install_lodop.exe'>执行升级</a>,升级后请重新进入。</font>";

        var strHtml3="<br><br><font color='#FF00FF'>(注：如曾安装过Lodop旧版附件npActiveXPLugin,请在【工具】->【附加组件】中先卸载它)</font>";

        var LODOP=oEMBED;       

     try{         

          if (navigator.appVersion.indexOf("MSIE")>=0) LODOP=oOBJECT;

 

          if ((LODOP==null)||(typeof(LODOP.VERSION)=="undefined")) {

            if (navigator.userAgent.indexOf('Firefox')>=0)

                document.documentElement.innerHTML=strHtml3+document.documentElement.innerHTML;

            if (navigator.appVersion.indexOf("MSIE")>=0) document.write(strHtml1); else

            document.documentElement.innerHTML=strHtml1+document.documentElement.innerHTML;

          } else if (LODOP.VERSION<"6.0.0.1") {

            if (navigator.appVersion.indexOf("MSIE")>=0) document.write(strHtml2); else

            document.documentElement.innerHTML=strHtml2+document.documentElement.innerHTML;

          }

          //*****如下空白位置适合调用统一功能:*********

 

          //*******************************************

          return LODOP;

     }catch(err){

          document.documentElement.innerHTML="Error:"+strHtml1+document.documentElement.innerHTML;

          return LODOP;

     }

}

其中的关键点是VERSION函数，Lodop提供了这个“读版本号”功能，这样控件的安装和升级任务就交给JS来实现，以下是控件在页面内的调用代码，其中包含getLodop的使用：

<head>

<title></title>

<script language="JavaScript" src="LodopFuncs.js"></script>

<object  id="LODOP" 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>

</head>

<body>

<script language="javascript">

var LODOP=getLodop(document.getElementById('LODOP'),document.getElementById('LODOP_EM'));

</script>

…

</body>

以上两段代码相互配合实现了Lodop的安装、调用和升级。之所以将LodopFuncs.js作为一个资源文件来部署，既可以利用浏览器的缓存减少页面内容的重复下载，同时还实现了控件发布统一管理，整个应用系统中只要这一个地方发布Lodop。其它页面直接拷贝嵌入第2段代码就可以了。


打印幅面高度不固定样例:

[html]  view plain  copy
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html>  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
  5. <title>WEB打印小票样例</title>  
  6. <!-- 控件跨浏览器调用类库-->  
  7. <script language="javascript" src="LodopFuncs.js"></script>  
  8. <!-- 调用LODOP控件代码-->  
  9. <object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0>  
  10.   <embed id="LODOP_EM" type="application/x-print-lodop" width=0 height=0 pluginspage="install_lodop.exe"></embed>  
  11. </object>  
  12. </head>  
  13. <body>  
  14. <input type="button" value="打印预览" onclick="printPreview()" />  
  15. <!-- 控制打印按钮,自动打印可以直接执行printOrder-->  
  16. <input type="button" value="直接打印" onclick="printOrder()" />  
  17. <script language="javascript" type="text/javascript">   
  18.         var LODOP; //声明为全局变量  
  19.         function printPreview(){  
  20.                 //创建小票打印页  
  21.         CreatePrintPage();  
  22.         //打印预览  
  23.         LODOP.PREVIEW();      
  24.             }  
  25.         /**  
  26.         * 样例函数,服务器确认订单后执行  
  27.         */  
  28.     function printOrder() {  
  29.               
  30.         //创建小票打印页  
  31.         CreatePrintPage();  
  32.         //开始打印  
  33.         LODOP.PRINT();    
  34.           
  35.     };            
  36.     function CreatePrintPage(json) {  
  37.         //json 创建模拟服务器响应的订单信息对象  
  38.         var json = {"title":"XXXXX订单信息", "name":"张三", "phone": "138123456789", "orderTime": "2012-10-11 15:30:15",   
  39.         "orderNo": "20122157481315", "shop":"XX连锁", "total":25.10,"totalCount":6,  
  40.         "goodsList":[  
  41.         {"name":"菜心(无公害食品)", "price":5.00, "count":2, "total":10.08},   
  42.         {"name":"菜心(无公害食品)", "price":5.00, "count":2, "total":10.02},   
  43.         {"name":"旺菜", "price":4.50, "count":1, "total":4.50},  
  44.         {"name":"黄心番薯(有机食品)", "price":4.50, "count":1, "total":4.50}  
  45.         ]  
  46.         }     
  47.         var hPos=10,//小票上边距  
  48.         pageWidth=580,//小票宽度  
  49.         rowHeight=15,//小票行距  
  50.         //获取控件对象  
  51.         LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'));   
  52.         //初始化   
  53.         LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_名片");  
  54.         //添加小票标题文本  
  55.         LODOP.ADD_PRINT_TEXT(hPos,30,pageWidth,rowHeight,json.title);  
  56.         //上边距往下移  
  57.         hPos+=rowHeight;  
  58.           
  59.         LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,"姓名:");  
  60.         LODOP.ADD_PRINT_TEXT(hPos,30,pageWidth,rowHeight,json.name);  
  61.         //hPos+=rowHeight; //电话不换行  
  62.         LODOP.ADD_PRINT_TEXT(hPos,70,pageWidth,rowHeight,"电话:");  
  63.         LODOP.ADD_PRINT_TEXT(hPos,100,pageWidth,rowHeight,json.phone);  
  64.         hPos+=rowHeight;  
  65.         LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,"下单时间:");  
  66.         LODOP.ADD_PRINT_TEXT(hPos,60,pageWidth,rowHeight,json.orderTime);  
  67.         hPos+=rowHeight;  
  68.         LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,"订单编号:");  
  69.         LODOP.ADD_PRINT_TEXT(hPos,60,pageWidth,rowHeight,json.orderNo);  
  70.         hPos+=rowHeight;  
  71.         LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,"取货门店:");  
  72.         LODOP.ADD_PRINT_TEXT(hPos,60,pageWidth,rowHeight,json.shop);  
  73.         hPos+=rowHeight;  
  74.         LODOP.ADD_PRINT_LINE(hPos,2, hPos, pageWidth,2, 1);  
  75.         hPos+=5;  
  76.         LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,"商品名称");  
  77.         LODOP.ADD_PRINT_TEXT(hPos,70,pageWidth,rowHeight,"单价");  
  78.         LODOP.ADD_PRINT_TEXT(hPos,110,pageWidth,rowHeight,"数量");  
  79.         LODOP.ADD_PRINT_TEXT(hPos,140,pageWidth,rowHeight,"小计");  
  80.         hPos+=rowHeight;  
  81.         //遍历json的商品数组  
  82.         for(var i=0;i<json.goodsList.length;i++){  
  83.               
  84.             if(json.goodsList[i].name.length<4){  
  85.                 LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,json.goodsList[i].name);  
  86.             }else {  
  87.                 //商品名字过长,其他字段需要换行  
  88.                 LODOP.ADD_PRINT_TEXT(hPos,1,pageWidth,rowHeight,json.goodsList[i].name);  
  89.                 hPos+=rowHeight;  
  90.             }  
  91.             LODOP.ADD_PRINT_TEXT(hPos,70,pageWidth,rowHeight,json.goodsList[i].price);  
  92.             LODOP.ADD_PRINT_TEXT(hPos,115,pageWidth,rowHeight,json.goodsList[i].count);  
  93.             LODOP.ADD_PRINT_TEXT(hPos,140,pageWidth,rowHeight,json.goodsList[i].total);  
  94.             hPos+=rowHeight;  
  95.             }  
  96.         //商品遍历打印完毕,空一行  
  97.         hPos+=rowHeight;  
  98.         //合计  
  99.         LODOP.ADD_PRINT_TEXT(hPos,80,pageWidth,rowHeight,"合计:"+json.totalCount);  
  100.         LODOP.ADD_PRINT_TEXT(hPos,130,pageWidth,rowHeight,"￥"+json.total);  
  101.           
  102.         hPos+=rowHeight;  
  103.         LODOP.ADD_PRINT_TEXT(hPos,2,pageWidth,rowHeight,(new Date()).toLocaleDateString()+" "+(new Date()).toLocaleTimeString())  
  104.         hPos+=rowHeight;  
  105.         LODOP.ADD_PRINT_TEXT(hPos,25,pageWidth,rowHeight,"谢谢惠顾,欢迎下次光临!");  
  106.         //初始化打印页的规格  
  107.         LODOP.SET_PRINT_PAGESIZE(3,pageWidth,45,"XXXXX订单信息");  
  108.           
  109.     };    
  110. </script>  
  111. </body>  
  112. </html>  
大王叫我来巡山哟
关注
专栏目录
lodop 小票排版_Web打印--Lodop 打印小票购物单
weixin_36247564的博客
01-14 543
codebase="http://www.4fang.net/4ff/sc_setup.exe"id="pazu"name="pazu" >function getNowDateTime(){var d = new Date();var vYear = d.getFullYear();var vMon = d.getMonth() + 1;var vDay = d.getDate()var ...
前端打印小票lodop.rar
06-06
包含了前端js引用打印小票机打印小票的js文件，还有所必须安装的插件
lodop+art-template实现web端漂亮的小票样式打印
weixin_30354675的博客
06-20 737
一. 现状 由于之前采用Lodop打印控件(商业版付费,可以使用免费版 但是会有水印)去打印小票，是一行一行的打印，但是不满足UI给到复杂布局的小票样式，所以得重新考虑如何来实现。 二. 介绍 art-template介绍 art-template 是一个简约、超快的模板引擎。 它采用作用域预声明的技术来优化模板渲染速度，从而获得接近 JavaScript 极限的运行性能，并且同时支持 NodeJ...
指定打印机打印、条码 、小票打印 web端打印机控件 LODOP的使用
qq_41629498的博客
08-08 4774
最近项目需要指定打印机进行前台后厨小票同时打印 1.首先安装LODOP插件点击下载 2 将LodopFuncs.js文件复制到自己项目 注意：vue项目需要底部添加 export { getLodop } 3获取当前连接的打印机设备名称 添加前台或者后厨 或者热菜 凉菜 let LODOP=getLodop() let listCount=LODOP.GET_PRINTER_COUNT() //当前打印设备数量 let list=[] for( let i=0;i..
基于Lodop打印php网页小票打印实例
02-09
Lodop是一个基于ActiveX和JavaScript技术的浏览器打印控件，可以跨平台运行在IE、Chrome、Firefox等主流浏览器上。它的主要功能是提供一种与服务器端语言（如PHP）交互的接口，用于处理打印任务，包括自定义布局、...
一种基于浏览器的自动小票机打印实现方案(js版)
10-21
2. lodop：lodop是一个用于Web打印的JavaScript打印控件，支持在Web页面上实现套打和票据打印等功能。它提供了一个丰富的API，允许开发者在不弹出打印对话框的情况下，直接调用打印机进行打印。它支持多种操作系统和...
基于Lodop控件的Web打印
08-23
【基于Lodop控件的Web打印】是一种高效且便捷的网页打印解决方案，它使得用户无需依赖特定的报表工具，可以直接在Web页面上实现“所见即所得”的打印效果。Lodop控件是一个专为网页打印设计的ActiveX插件，通过在...
PrintSettings-C_winform-lodop打印.rar
06-25
LODOP，全称为“Local Operation Data Process”，是一款强大的网页打印控件，能够实现各种复杂的打印功能，包括在线套打、批量打印等。在C/S架构的应用程序中，它为开发者提供了便利的API接口，使得在C#环境下进行...
客户端对服务器端的pdf文件进行自动打印
07-31
客户端通过服务器端的虚拟路径把服务器端的pdf文件复制到客户端进行自动印刷。
lodop 调用打印机
07-21
调用打印机，js调用，兼容各类浏览器，功能强大齐全
js 生成 一维码(条形码) 并能打印，小票打印
08-11
废了好大劲 ，终于搞出来了一个 打印小票的功能，请各位使用！
LodopFuncs(网页打印控件Lodop)
08-03
网页打印控件Lodop软件是著名打印控件Lodop的繁体(BIG5)版.WEb打印控件Lodop自面世以来,被称为打印控件的终结者,港澳台用户需求强烈,自4.1开始发布繁体版和英文版.
通过Web打印超市一样的小票
04-21
通过Web打印超市一样的小票。测试可以使用。。。
vue项目使用LODOP打印小票功能
maomi199的博客
01-02 4872
毕业后第一份工作是做后台管理系统的，项目中要求有打印小票功能，然而我并不知道，该怎么写，百度了很多。一开始在网上查到很多都在用electron+vue我以为我可以用这个呢，搞了两天，才发现这是做桌面软件的，后来查到lodop才开始用的，在这里我得先感谢我的后端，因为如果没有我这个后端，我有可能转行了。现在我把在项目中怎么实现的说一下，我做的很糙，希望能对你们有些帮助。 **第一步**创建一个叫...
【解决】简单有效的使用lodop打印小票功能
weixin_46367300的博客
06-28 1694
** 【解决】简单有效的使用lodop打印小票功能 ** 第一步: 下载：http://www.lodop.net/download.html 下载完后解压。 第二步：安装lodop驱动 第三步：将文件放入js文件 修改路径 第四步：在所需的html里面引入LodopFuncs.js 第五部： <script src="js/LodopFuncs.js"></script> <script> var LODOP; //声明为全局变量 function
客户端定时自动打印页面的例子
weixin_33847182的博客
12-02 168
 介绍客户端自动打印功能的例子，客户只要在电脑上打开该页面，就可以定时检查打印任务，并触发打印机自动打印，打印后可以将本次打印的信息提交到数据的表中。 该功能用到润乾报表如下功能： 1 直接打印函数report1_directPrint() 2 打印后回调页面动作函数runqian_printOver() （类似打印成功后自动回调页面的函数其它报表工具还不...
Web打印--Lodop 打印小票购物单
热门推荐
LYBWWP
09-08 1万+
codebase="http://www.4fang.net/4ff/sc_setup.exe"         id="pazu"         name="pazu" >                               function getNowDateTime()          {                var d = new D
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值