一、概述

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

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

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

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

二、系统文件

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

install_lodop.exe

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

Lodop安装后，在操作系统目录WINDOWS\system32下会安装两个实体文件：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段代码就可以了。

三、控件参数

Lodop有如下控件参数,以页面object对象元素的参数形式使用：

Caption

名称：设置控件的显示标题

格式：<param name="Caption" value="我是打印控件lodop">

功能： 控件在页面内一般是以object元素形式被引用。可以通过设置元素的width和height等于0来隐藏控件，不隐藏时可以为控件设置一个标题，以便于看到控件是否被正确安装，以及控件对象在页面内的位置。希望打印预览界面或设计界面内嵌到网页内时，本参数很有用。

Color

名称：设置控件的显示区域颜色

格式：<param name="Color" value="#C0C0C0">

功能：通过该参数设置控件显示区域的底色，对于希望打印预览界面或设计界面内嵌到网页内时，本参数可以让控件容易融于整体页面。

参数值采用超文本颜色形式，可以是三色16进制值组合，也可以是英文颜色名。

 

Border


名称：设置控件的显示区域边界

格式：<param name="Border" value="1">

功能：通过该参数设置控件显示区域的边界，值等于1表示有边界，否则无边界。本参数可以让控件更融于整体页面。


四、打印实例

一般打印

function print(data,orderData){
LODOP=getLodop(document.getElementById('LODOP_OB'),document.getElementById('LODOP_EM'));//得到适配
LODOP.PRINT_INITA(data["upDown"],data["leftRight"],data["width"]-data["leftRight"],data["height"]-data["upDown"],"打印");//打印初始化
LODOP.SET_PRINT_PAGESIZE(1,data["width"]+"mm",data["height"]+"mm","");//设置纸张
var print_item = data.piMap;
$.each(_printItem, function(i, item) {
if(print_item[item]!=null&&print_item[item]!=undefined){
var a = print_item[item]; 
LODOP.ADD_PRINT_TEXT(a.top,a.left,a.width,a.height,orderData[item]);//设置距离打印文本
}
});
LODOP.PRINTA();//打印
}

在页面内嵌入打印控件

 

<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 pluginspage="install_lodop.exe"></embed>

</object>

缩放打印图片

function myPreview2() {

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

LODOP.ADD_PRINT_IMAGE(30,150,600,400,"<img border='0' src='http://www.baidu.com/img/baidu_logo.gif'/>");

LODOP.SET_PRINT_STYLEA(1,"Stretch",1);//(可变形)扩展缩放模式

LODOP.PREVIEW();

};

function myPreview3() {

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

LODOP.ADD_PRINT_IMAGE(30,150,600,80,"<img border='0' src='http://www.baidu.com/img/baidu_logo.gif'/>");

LODOP.SET_PRINT_STYLEA(1,"Stretch",2);//按原图比例(不变形)缩放模式

LODOP.PREVIEW();

};

 

控制表格的打印样式

function myPreview3(){

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

var strBodyStyle="<style>table { border: 1 solid #000000;border-collapse:collapse }</style>";

varstrFormHtml=strBodyStyle+"<body>"+document.getElementById("form1").innerHTML+"</body>"; 

LODOP.ADD_PRINT_TEXT(50,50,260,39,"细线样式打印：");

LODOP.ADD_PRINT_HTM(88,50,300,200,strFormHtml);

LODOP.PREVIEW();

};

打印内容旋转

function CreateOneFormPage(){

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

LODOP.SET_PRINT_STYLE("FontName","黑体");

LODOP.SET_PRINT_STYLE("FontSize",15);

LODOP.ADD_PRINT_TEXT(71,162,120,35,"正常内容");

LODOP.ADD_PRINT_TEXT(232,355,325,34,"纯文本逆时针旋转90度\n");

LODOP.SET_PRINT_STYLEA(0,"Angle",90);

LODOP.ADD_PRINT_TEXT(181,161,346,34,"纯文本逆时针旋转45度\n");

LODOP.SET_PRINT_STYLEA(0,"Angle",45);

LODOP.ADD_PRINT_HTM(230,98,163,200,"<table border=\"1\"><tr>\n<td style=\"writing-mode: tb-rl;\">旋转90度</td>\n<td>正常<p>超文本</p><p>内容</p></td>\n</tr></table>\n\n");

};

 

用代码设计复杂的文本打印

function CreateFullBill() {

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

LODOP.SET_PRINT_STYLE("FontColor","#0000FF");

LODOP.ADD_PRINT_SHAPE(2,116,43,655,373,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(1,144,44,653,1,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(1,172,44,653,1,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,116,143,1,56,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,116,488,1,56,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,116,574,1,372,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,172,166,1,282,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,172,415,1,282,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(1,454,44,653,1,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,454,130,1,34,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,454,483,1,34,0,1,"#800000");

LODOP.ADD_PRINT_SHAPE(0,64,62,120,1,0,1,"#0000FF");

LODOP.ADD_PRINT_SHAPE(3,29,62,32,32,0,4,"#0000FF");

LODOP.ADD_PRINT_SHAPE(3,21,300,147,75,0,3,"#FF0000");

LODOP.ADD_PRINT_SHAPE(3,26,307,132,65,0,1,"#FF0000");

LODOP.ADD_PRINT_TEXT(33,192,408,30,"中国移动通信集团北京有限公司专用发票");

LODOP.SET_PRINT_STYLEA(0,"FontSize",15);

LODOP.SET_PRINT_STYLEA(0,"FontColor","#800000");

LODOP.SET_PRINT_STYLEA(0,"Alignment",2);

LODOP.ADD_PRINT_TEXT(68,326,100,25,"发