web 项目实现打印机功能

本贴最后更新于 1785 天前,其中的信息可能已经斗转星移

之前有 web 项目要用到打印机功能,来打印小票;
我在网上搜了下就是简单的 js 代码来实现打印机;
但我的业务不能在页面再来设计打印的功能的配置;

所以我找了个第三方的浏览器控件——Lodop
我就是使用的 Lodop

首先来配置环境

先来下载 Lodop 的环境
Lodop 综合版(Lodop6.226+CLodop3.083)

在下载的压缩文件解压缩后的 CLodop_Setup_for_Win32NT.exe 安装,就可以使用了。

使用

在 html 导入,在 head 或 body 中加入

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

使用的话

var LODOP=getLodop();//直接这样就得到了打印控件对象

常用的方法

PRINT_INIT(strPrintTaskName)//打印初始化
SET_PRINT_PAGESIZE(intOrient,intPageWidth,intPageHeight,strPageName)//设定纸张大小
ADD_PRINT_HTM(intTop,intLeft,intWidth,intHeight,strHtml)//增加超文本项
ADD_PRINT_TEXT(intTop,intLeft,intWidth,intHeight,strContent)//增加纯文本项
ADD_PRINT_TABLE(intTop,intLeft,intWidth,intHeight,strHtml)//增加表格项
ADD_PRINT_SHAPE(intShapeType,intTop,intLeft,intWidth,intHeight,intLineStyle,intLineWidth,intColor)//画图形
SET_PRINT_STYLE(strStyleName, varStyleValue)//设置对象风格
PREVIEW()//打印预览
PRINT()//直接打印
PRINT_SETUP()//打印维护
PRINT_DESIGN()//打印设计

这里使用它的官方的样例

<script language="javascript" type="text/javascript">        
        var LODOP; //声明为全局变量       
	function myPrint() {		       
		CreatePrintPage();       
		LODOP.PRINT();		       
	}; 
	function CreatePrintPage() {       
		LODOP=getLodop();         
		LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_名片");       
		LODOP.ADD_PRINT_RECT(10,55,360,220,0,1);       
		LODOP.SET_PRINT_STYLE("FontSize",11);       
		LODOP.ADD_PRINT_TEXT(20,180,100,25,"郭德强");       
		LODOP.SET_PRINT_STYLEA(2,"FontName","隶书");       
		LODOP.SET_PRINT_STYLEA(2,"FontSize",15);		       
		LODOP.ADD_PRINT_TEXT(53,187,75,20,"科学家");       
		LODOP.ADD_PRINT_TEXT(100,131,272,20,"地址:中国北京社会科学院附近东大街西胡同");       
		LODOP.ADD_PRINT_TEXT(138,132,166,20,"电话:010-88811888");	       
	};      
</script> 

预览效果:
js.png

更直观的方法

上面的方法其实还是有点抽象的
Lodop 也提供了直接打印 html 的方法

//直接将idName的内容打印出来
var strHtml  = document.getElementById("idName").innerHTML
LODOP.ADD_PRINT_HTM(10,55,"100%","100%",strHtml);

我是用的这个来打印小票;
测试.jpg

更多详细内容,请看官方文档
http://www.lodop.net/LodopDemo.html

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...