【JS】通过JS实现超市小票打印功能——ActiveX控件

  • 应客户的需求= = ,要在网页端实现打印小票的功能
  • 先来一张打印出的小票效果图(合计明显不对,因为有修改订单功能,请各位忽略)

  

  • 用什么方法实现呢:我想应该是有三种吧

    1.用第三方的浏览器控件(这个好似比较方便,我的老师也是这样建议我)向大家推荐一个 Lodop打印控件

    2.用CSS写好模板,然后直接用页面打印的方法(应该是这样吧)

      (以上两种还没有尝试,这两天陆续尝试)

    3.用微软自己的ActiveX控件(ActiveX控件可以实现调用本地的文件等操作(之前试过调用cmd,实现shutdown -s -t,在网页控制电脑的定时关机))

    当然这种方法的缺点也很明显:限操作系统-因为是微软的东西只能Windows下,限浏览器-因为ActiveX也只能在IE浏览器下。所以局限性比较大

  • 实现过程:

    1.编辑『word小票模板』,要用到word中『书签』这个工具(通过『书签』的定位,js就可以操作word在『书签』指定的位置进行 修改、写入内容)

    2.在js对word模板进行 打开、赋值、打印操作

  • 一、编辑『word小票模板』

    1.以word2007为例,首先排好大致的样式

      

    2.用『书签』进行标记定位

      选中要添加书签的文字区域-点击『书签』-填写书签名-点击『添加』-『定位』可以查看此书签的位置

                   

  • 二、js

直接上源代码吧:

<input type="button" value="toPrinter " onclick="viewToWord();" />  
 1 function viewToWord() {
 2         //当前时间
 3         var Time;
 4         var today = new Date();
 5         Time = today.toLocaleString();
 6
 7         try {
 8             // 创建ActiveXObject对象
 9             wdapp = new ActiveXObject("Word.Application");
10         }
11         catch (e) {
12             console.log("无法调用Office对象,!", e)
13             wdapp = null;
14             return;
15         }
16         wdapp.Documents.Open("f:\\PrinterTemplate1.doc"); //打开本地(客户端)word模板
17         wddoc = wdapp.ActiveDocument;
18         wddoc.Bookmarks("OrderNum").Range.Text = "201509080959" + "\n";
19         wddoc.Bookmarks("OrderName").Range.Text = "郑斌" + "\n";
20         wddoc.Bookmarks("OrderAddress").Range.Text = "www.cnblogs.com/zhengbin" + "\n";
21         wddoc.Bookmarks("OrderPhoneNum").Range.Text = "QQ:1746788394" + "\n";
22         wddoc.Bookmarks("OrderDaocanTime").Range.Text = "10:00-11:00" + "\n";
23         wddoc.Bookmarks("OrderTime").Range.Text = "09-08 10:15";
24         //添加表格
25         var myTable = wddoc.Tables.Add (wddoc.Bookmarks("OrderCart").Range,3,3);//(赋值区域,行数,列数)
26         //隐藏边框
27         var table=wdapp.ActiveDocument.Tables(1);
28         table.Borders(-1).LineStyle=0;
29         table.Borders(-2).LineStyle=0;
30         table.Borders(-3).LineStyle=0;
31         table.Borders(-4).LineStyle=0;
32         table.Borders(-5).LineStyle=0;
33         table.Borders(-6).LineStyle=0;
34         for(i=1;i<=3;i++){//行
35             //第一列
36             with (myTable.Cell(i,1).Range){
37                 font.Size = 8;//调整字体大小
38                 InsertAfter("博客园"+i);//插入的内容
39             }
40             //第二列
41             with(myTable.Cell(i,2).Range){
42                 font.Size = 8;
43                 InsertAfter(i);
44                 ParagraphFormat.Alignment=1;//表格内容对齐:0-左对齐 1-居中 2-右对齐
45             }
46             //第三列
47             with(myTable.Cell(i,3).Range){
48                 font.Size = 8;
49                 InsertAfter("无价");
50                 ParagraphFormat.Alignment=2;
51             }
52         }
53         wddoc.saveAs("f:\\PrinterTemp_cnblogs.doc"); //保存临时文件word
54         wddoc.Bookmarks("TotalPrice").Range.Text = "无价" + "\n";
55         wddoc.Bookmarks("Time").Range.Text = Time;
56         //wdapp.ActiveDocument.ActiveWindow.View.Type = 1;
57         wdapp.visible = false; //word模板是否可见
58         wdapp.Application.Printout(); //调用自动打印功能
59         wdapp.quit();
60         wdapp = null;
61     }

  最后:

    

  • 注意:

    首先要调整好IE浏览器的 Internet选项-自定义级别(右边『ActiveX控件和插件』下,能启用的都启用)

    

    『打印机脱机工作』一般是usb没有插好,换插口,重启打印机即可

  • 感谢以下几位博主非常精彩的博文:

  http://kuangbaoxu.iteye.com/blog/193311

  http://baser.blog.51cto.com/4153192/844742

  http://xiaosuncunzhang.blog.51cto.com/317407/584844

  http://blog.csdn.net/weizengxun/article/details/6870880

  http://blog.sina.com.cn/s/blog_692d0a650100klr4.html

时间: 2024-11-15 21:02:30

【JS】通过JS实现超市小票打印功能——ActiveX控件的相关文章

【JS】打印Excel——ActiveX控件

1 function viewToExcel(){ 2 var filepath = "f:\\PrinterExcel.xls"; 3 var xlApp; 4 var xlBook; 5 var xlSheet; 6 try { 7 xlApp = new ActiveXObject("Excel.Application"); 8 } 9 catch (e) { 10 alert("请调整IE安全选项"); 11 return; 12 } 1

Atitit.收银机小票打印功能的设计&#160;&#160;java&#160;php&#160;c#.net版本

Atitit.收银机小票打印功能的设计  java php c#.net版本 1. 1. 打印方式有4种:1 1.1. 1.1. 一是不经过任何修改,直接调用javascript中的window.print()打印.1 1.2. 1.2. 二根据客户要求的报表格式,编写相应格式的html,装载数据打印,同样调用window.print()打印,只是对html的格式要求比较高.1 1.3. 1.3. 三是通过客户提供的word格式,通过xml配置文件与数据库的数据进行关联,自动装载数据到word中

“小票打印”功能来了!酷客多带你玩转小程序

酷客多(http://www.kukeduo.cn)最近给小程序推出了一个新功能,小票打印功能,可以说这是众多运营者期待已久的功能,这次终于等到了.对于餐饮业运营者来说,这次新功能的推出更加给予了他们极大的便利.现在马上带你感受感受这次酷客多推出的重磅功能! 一.打印准备 1. 打开包装 2. 装入打印纸 移除 二.打印本机信息(用于商家后台配置) 1. 接通打印机电源 2. 长按左键开启打印机 移除 3. 初次开机会自动打印提示 4. 按右键进入菜单 移除 5. 按右键,打印本机信息 移除 三

多功能弹窗控件layer

开发网站的时候,如何合理运用好各种插件对开发的帮助是很大的. 免去了我们调试各种交互效果, 比如常用的弹窗.气泡.提示.加载.焦点.标签.导航.折叠等等 这里会推荐几个常用的js插件,丰富多样简单易移植很适合我们做前台开发使用 第一个插件:多功能弹窗控件layer-v2.4  下载地址:http://layer.layui.com/ 页面调用js 1 //初体验 2 layer.alert('内容') 3 //第三方扩展皮肤 4 layer.alert('内容', { 5 icon: 1, 6

功能类控件

驰骋工作流引擎将出发各种事件的控件称之为功能类控件,驰骋表单设计器中有控件分类:按钮,鼠标.选择,超连接. 按钮 表单上面的按钮对象,可以处理事件内容. 特别说明:ccBPM所有的事件内容的处理方式都是一致的,目前所涉及的事件有,表单事件.按钮事件.流程事件. 1.总体说明 每个按钮有自己的按钮类型,使用自定义按钮类型. 属性 说明 按钮事件类型 事件类型决定按钮执行的内容. 事件内容 就是要执行的内容,内容里面可以有变量,变量来自与表单.变量的表达方式仍然用@+变量名来决定,比如:@jiner

0923 容器,打印和对话框控件

布局 一般有两种布局方式:Anchor-锁定与边框的位置;Dock-填充位置,与容器进行配合使用 容器 之前我们简单运用过panel,我们来说一下下面几个容器 1.FlowLayoutPanel-流式布局容器 里面放置的控件会按照一定的顺序排列 2.GroupBox-分组容器 容器分组,并且出现小标题,出现一个边框 3.SplitContainer-二分容器 将容器的内部一分为二可以调节左右大小,并且可以嵌套 4.TabControl-标签容器 将区域加上标签,每个标签可以放入不同内容 5.Ta

IE下JS接受ActiveX控件方法

1.常规写法 <SCRIPT type="text/javascript" FOR="activexID" EVENT="onXXXevent()" > // js 处理具体内容. </SCRIPT> 当acitveX控件 onXXXevent()事件被触发时,调用此方法. 2.注意事项 这种方法只是IE下支持,且要注意 <SCRIPT type="text/javascript" FOR=&qu

SQL 存储过程 超市小票打印

create database chaoshils--创建一个数据库 go use chaoshils--使用这个数据库 go create table gongying--创建一个供应商的表格 ( gcode int primary key identity(1001,1),--供应商编号,主键 gname varchar(20),--名称 gsdh varchar(20),--电话 gsdz varchar(20)--地址 ) --向供应商表格中添加数据 insert into gongyi

WdatePicker.js的使用方法 帮助文档 使用说明(时间控件)*转载

4. 日期范围限制 静态限制 注意:日期格式必须与 realDateFmt 和 realTimeFmt 一致 你可以给通过配置minDate(最小日期),maxDate(最大日期)为静态日期值,来限定日期的范围 示例4-1-1 限制日期的范围是 2006-09-10到2008-12-20 <input id="d411" class="Wdate" type="text" onfocus="WdatePicker({skin:'w