因为打印机的地方连续需要调整的,利用一个htm文件就足以兑现模板设计过程

 

第八步:完成打印模板设计文本

想不想领会WEB套打有吗觉得?好,我们先做一个静态WEB页面爽一下:把第七步生成的程序代码,

安插替换第一步的空白设计文本CreatePrintPage函数内,变成如下内容:

 

<html>
<body>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0></object>
<script language="javascript" type="text/javascript">
  function CreatePrintPage() {
    LODOP.PRINT_INITA(14,11,800,600,"套打EMS的模板");
    LODOP.ADD_PRINT_TEXT(95,95,75,20,"寄件人姓名");
    LODOP.ADD_PRINT_TEXT(123,148,194,20,"寄件人单位名称");
    LODOP.ADD_PRINT_TEXT(158,101,238,35,"寄件人的详细地址");
    LODOP.ADD_PRINT_TEXT(92,446,75,20,"收件人姓名");
    LODOP.ADD_PRINT_TEXT(122,496,208,20,"收件人单位名称");
    LODOP.ADD_PRINT_TEXT(160,460,244,35,"收件人详细地址");
    LODOP.ADD_PRINT_TEXT(289,47,178,22,"内件品名");
    LODOP.ADD_PRINT_TEXT(290,258,100,20,"内件数量");
    LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人电话");
    LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人电话");
  };    
</script> 
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();LODOP.PRINT_DESIGN();">模板设计</a><br><br>
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();LODOP.PREVIEW();">模板的打印预览</a>
</body>
</html>

 

  

   把上述内容复制到此外一个htm文件printEMS_OK.htm中,双击打开它,点其中的打印预览,就足以兑现简单的WEB套打了。

   以上八步基本完成了模版设计,并贯彻静态页面套打,但要把模版代码融合到实在的WEB程序中,还索要做些工作。

 此外,由于表格的始末都是写在HTML页面中的,因而在动态设置情节的时候,一能够用脚本来读取界面元素作为数据源,二足以透过后台代码自动生成脚本代码,输出到前台页面中,看现实的急需了。

 

在套打的时候,注意需要经过下边代码来设置彰显背景图片(打印的时候,是不打印背景的)。

第十一步:让操作者自己调整岗位

    以上十步实现的套打可以很标准,但都是以如今打印机为前提。假使您的打印程序要直面诸多连串型的打印机,甚至部分不为人知的打印机类型,那么“打印维护”效用会很有用处。你可以遵照事态在程序中把该效用授权给最终操作者或现场技术维护人员,让使用者自己来调动打印地方,以适应各类类型的打印机。

   打印维护的授命语句是PRINT_SETUP,进入包含该意义的在线文件PrintEMS_OKMSetup.htm,先在打印维护中调整一下打印内容或整体地方,点“应用”按钮。关闭浏览器后重新打开,进入“打印预览”,看看是不是有涉嫌变化。下图是打印维护界面,其中能收看“应用”按钮和“复原完整缺省”按钮的职位。

图片 1
                               
研究生恋爱网转自http://blog.sina.com.cn/s/blog_721e77e50100ng1o.html

        var licenseDate = document.getElementById(“txtLicenseDate”).value;//证件有效期
        var licenseYear = “”;
        var licenseMonth = “”;
        var licenseDay = “”;
        if (licenseDate != null && licenseDate != “”) {
            licenseYear = licenseDate.split(“-“)[0];
            licenseMonth = licenseDate.split(“-“)[1];
            licenseDay = (licenseDate.split(“-“)[2]).substr(0, 2);
        }

其三步:准备计划

    成功安装Lodop之后再行打开模板设计文本printEMS.htm,点击其中“模板设计”链接,就弹出如下空白的打印设计窗口:图片 2

   为了尽早定位模板中的数据地点,你需要做一张单子扫描图作为背景,当然没有扫描图也能一鼓作气,只是需要多摸索一回,费点时间而已。

   下边是本人做的EMS扫描图,你把该图另存成一个jpg文件,以便我们一块完成后边的示范步骤。

图片 3

打印设计是面向开发人士的,先导需要经过这多少个意义来计划好套打的界面,就是基于套打证件的背景图片,大致摆放好各样内容的岗位。

第十步:设置纸张中度,实现连接套打

大多数套打业务的票子是连连纸,需要规范地分页,从而确保连续多页打印不偏移,

为此以上代码还要在PRINT_INITA之后加一行SET_PRINT_PAGESIZE语句:

function CreatePrintPage() {
    LODOP.PRINT_INITA(14,11,800,600,”套打EMS的模板”);
    LODOP.SET_PRINT_PAGESIZE(1,”209mm”,”113mm”,””);//设置纸张中度
    LODOP.ADD_PRINT_TEXT(95,95,75,20,”寄件人姓名”);
    LODOP.ADD_PRINT_TEXT(123,148,194,20,”寄件人单位名称”);
    LODOP.ADD_PRINT_TEXT(158,101,238,35,”寄件人的详尽地址”);
    LODOP.ADD_PRINT_TEXT(92,446,75,20,”收件人姓名”);
    LODOP.ADD_PRINT_TEXT(122,496,208,20,”收件人单位名称”);
    LODOP.ADD_PRINT_TEXT(160,460,244,35,”收件人详细地址”);
    LODOP.ADD_PRINT_TEXT(289,47,178,22,”内件品名”);
    LODOP.ADD_PRINT_TEXT(290,258,100,20,”内件数量”);
    LODOP.ADD_PRINT_TEXT(92,245,100,20,”寄件人电话”);
    LODOP.ADD_PRINT_TEXT(90,608,75,20,”收件人电话”);
};

   其中209mm那些纸宽参数意义不大,首假诺113mm这一个低度参数,它决定了每页的走纸距离,对连年打印影响很大。这一个值是本身测量实际票据中度得来的,包含纸张之间的撕孔间隙。理想的测量方法,是多少页连起来共同测量取其平均高。

   出席纸高支配后的打印预览如下,你可以连续不断打印两页内容到同样张长一些的白纸上,测试对照一下探访。把上述投入SET_PRINT_PAGESIZE语句的代码复制进第六个htm文件printEMS_OKM.htm试跳。倘使从第二页开首,内容向下偏移,表明纸张低度设置比其实票据大,就减小113mm这一个参数值,否则增大它,这些参数能够确切到0.1mm。

图片 4

 

第四步:装载背景图并调动图片大小

打印设计窗口,点下图所示的“装载背景图…”菜单,调入以上保存的EMS图片文件。

图片 5

   装载背景图后,点上图所示的“调整背景图…”菜单,弹出下图“背景图调整”窗口,设定其中的图片宽度为209mm,中度113mm会自动生成。

   这些幅度值是自我测量实际票据得来的。假诺扫描图是按1:1比重获取的,那么调整背景图这一步就免了。

图片 6

        LODOP.ADD_PRINT_TEXT(95, 695, 250, 52, document.getElementById(“txtCompanyName”).innerText); //业户名称
        LODOP.SET_PRINT_STYLEA(1, “FontSize”, 14);
        LODOP.SET_PRINT_STYLEA(1, “Bold”, 1);

第七步:生成打印模板的程序代码

    套打测试成功后,点击第五步图中所示的“生成程序代码”菜单,出现下图结果,这个代码就是我们需要的模板程序代码,把她们复制出来,准备融合到你的页面程序中拔取。

图片 7

 

第九步:模板程序代码的使用

把上述CreatePrintPage函数举办简易改造,原函数如下:

function CreatePrintPage() {
    LODOP.PRINT_INITA(14,11,800,600,”套打EMS的模板”);
    LODOP.ADD_PRINT_TEXT(95,95,75,20,”寄件人姓名”);
    LODOP.ADD_PRINT_TEXT(123,148,194,20,”寄件人单位名称”);
    LODOP.ADD_PRINT_TEXT(158,101,238,35,”寄件人的详尽地址”);
    LODOP.ADD_PRINT_TEXT(92,446,75,20,”收件人姓名”);
    LODOP.ADD_PRINT_TEXT(122,496,208,20,”收件人单位名称”);
    LODOP.ADD_PRINT_TEXT(160,460,244,35,”收件人详细地址”);
    LODOP.ADD_PRINT_TEXT(289,47,178,22,”内件品名”);
    LODOP.ADD_PRINT_TEXT(290,258,100,20,”内件数量”);
    LODOP.ADD_PRINT_TEXT(92,245,100,20,”寄件人电话”);
    LODOP.ADD_PRINT_TEXT(90,608,75,20,”收件人电话”);
};

把内部的打印内容指出来做为变量参数,函数改成如下样式:

function
CreatePrintPage(strPName,strJJRXM,strJJRDW,strJJRDZ,strSJRXM,strSJRDW,strSJRDZ,strNJPM,strNJSL,strJJRDH,strSJRDH)
{
    LODOP.PRINT_INITA(14,11,800,600,strPName);        //打印任务名
    LODOP.ADD_PRINT_TEXT(95,95,75,20,strJJRXM);       //寄件人姓名
    LODOP.ADD_PRINT_TEXT(123,148,194,20,strJJRDW);    //寄件人单位名称
    LODOP.ADD_PRINT_TEXT(158,101,238,35,strJJRDZ);    //寄件人的详尽地址
    LODOP.ADD_PRINT_TEXT(92,446,75,20,strSJRXM);      //收件人姓名
    LODOP.ADD_PRINT_TEXT(122,496,208,20,strSJRDW);    //收件人单位名称
    LODOP.ADD_PRINT_TEXT(160,460,244,35,strSJRDZ);    //收件人详细地址
    LODOP.ADD_PRINT_TEXT(289,47,178,22,strNJPM);      //内件品名
    LODOP.ADD_PRINT_TEXT(290,258,100,20,strNJSL);     //内件数量
    LODOP.ADD_PRINT_TEXT(92,245,100,20,strJJRDH);     //寄件人电话
    LODOP.ADD_PRINT_TEXT(90,608,75,20,strSJRDH);      //收件人电话
};

以此改造后的JS函数仍然很好明白的,无论写入js文件或者直接嵌在页面内都简短易用。

只要您转移了内容的书体、大小、粗斜体等格式,代码还会多一些,但总体来说相比较短小。

 

WEB套打可选方案不多,理想的更少,利用免费控件Lodop+JavaScript实现规范套打,算是相比经典的挑选。这种方案其实比较简单,利用一个htm文件就足以兑现模板设计过程,几乎是“空手套”式的付出,但知情这个步骤仍旧需要点时间,下边一步步详尽演示验证:

 

第二步:用浏览器打开该公文

    在该地文件夹中双击该文件就足以打开,但在进入设计此前,你的机器需要设置Lodop,假设还没设置过,

请在如下地址下载安装文件(解压rar后运行那多少个exe文件,Lodop是一个1M左右的小文件):

http://mt.runon.cn/samples/install\_lodop.rar

或 http://mtsoftware.v053.gokao.net/samples/install\_lodop.rar

下边代码是经过脚本获取界面元从来拿到相应的情节的,这种意况切合于界面上也许会修改部分打印的内容的面貌。

第五步:添加多少内容,起始打印测试

     点下图所示“插入文本项”菜单,添加打印内容,内容项能够拖拉或精美调整,基本对准之后,点击“预览”按钮(注意旁边的“打印”按钮是收费效果,纸上会有水印,而“预览时的打印”按钮是完全免费的,我们用后世)。

    把内容打印到薄一点的白纸上,然后在日光下与真正票据透亮相比较,以最左最上的某部内容为标准,此外内容远近调整,如此反复测试直到所有情节互相地方都对准。

    这一步先成功内容之间的互相地点对准,等下一步处理一体化地方。

图片 8

出于从前未接触过套打,平昔以为套打是一个相比潜在和劳动的工作,因为打印机的职位连续需要调整的,你总不可能硬编码吧?可是倘若地点可调,有需要直观一些来处理,这就相比费心了。

 

        LODOP.ADD_PRINT_SETUP_BKIMG(“<img src=Report/证件背景.jpg’ />”);
        LODOP.SET_SHOW_MODE (“BKIMG_IN_PREVIEW”,1);
}
</script> 

第六步:全部对准

    由于打印机右侧距或下边距不自然是零或票据边缘有误差,所以固然第五步打印出来的内容相互地点是规范的,但打印到实在票据上仍会全体偏离一些,需要举行一体化地方调整。

   点击下图红圈所示的“纸钉”按钮,“纸钉”弹起后,整个计划版面就可往日后左右调整了,然后按上一步的艺术打印测试,直到完全对准成功。为了避免浪费票据,打印时仍可用薄白纸测试,注意此时透光对照时,纸张的左侧沿和下面沿要与票据对齐,通过观望内容的地方来判定是否完整对准。图片 9

 图片 10

首先步:建立一个空荡荡的模板设计文本

把以下超文本代码复制到一个当地htm文件中:

 

<html>
<body>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0></object>
<script language="javascript" type="text/javascript">
  function CreatePrintPage() {
    LODOP.PRINT_INIT("套打EMS的模板");
  };    
</script> 
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();LODOP.PRINT_DESIGN();">模板设计</a><br><br>
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();LODOP.PREVIEW();">模板的打印预览</a>
</body>
</html>

 

  

正文模拟EMS特快专递单的次第支付,文件起名为printEMS.htm,权且称它为模板设计文本

<script language=”javascript”>
    var LODOP=document.getElementById(“LODOP”);//那行语句是为了顺应DTD规范
    CheckLodop();
</script>
<script language=”javascript” type=”text/javascript”>   

        LODOP.ADD_PRINT_SETUP_BKIMG(“<img src=Report/证件背景.jpg’ />”);
        LODOP.SET_SHOW_MODE (“BKIMG_IN_PREVIEW”,1);
//打印预览时是否带有背景图

诚如的套打,包含了几局部操作:打印预览、打印维护、打印设计。

图片 11

套打的预览界面大致如下图所示,其中粉红色部分是亟需打印的始末,背景图片是一个发票的金科玉律。

    };    
    function RealPrint() {        
        CreateDataBill();
        if (LODOP.PRINTA()) 
           alert(“已发出实际打印命令!”); 
        else 
           alert(“舍弃打印!”); 
    };    
    
function CreateDataBill() {
        LODOP.SET_PRINT_PAPER(10,10,762,533,”打印控件效率演示_Lodop功能_移动公司发票套打”);
        LODOP.ADD_PRINT_TEXT(126,150,100,20,”郭德刚”);
        LODOP.SET_PRINT_STYLEA(1,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(151,150,100,20,”13954885177″);
        LODOP.SET_PRINT_STYLEA(2,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(125,584,99,20,”发票打印(第1次)”);
        LODOP.SET_PRINT_STYLEA(3,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(465,140,198,20,”陆百柒拾捌元叁角零分”);
        LODOP.SET_PRINT_STYLEA(4,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(465,599,70,20,”678.30″);
        LODOP.SET_PRINT_STYLEA(5,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(496,408,59,20,”H112063″);
        LODOP.SET_PRINT_STYLEA(6,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(191,58,100,20,”国内旅游通话”);
        LODOP.SET_PRINT_STYLEA(7,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(191,217,100,20,”584.00″);
        LODOP.SET_PRINT_STYLEA(8,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(222,58,100,20,”增值业务费”);
        LODOP.SET_PRINT_STYLEA(9,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(222,217,100,20,”48.30″);
        LODOP.SET_PRINT_STYLEA(10,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(251,58,100,20,”代收费”);
        LODOP.SET_PRINT_STYLEA(11,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(251,217,100,20,”50.00″);
        LODOP.SET_PRINT_STYLEA(12,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(280,58,100,20,”优惠费”);
        LODOP.SET_PRINT_STYLEA(13,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(280,217,100,20,”4.00″);
        LODOP.SET_PRINT_STYLEA(14,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(98,101,150,20,”101081005747319387″);
        LODOP.SET_PRINT_STYLEA(15,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(97,307,150,20,”2008年10月19日 10:28:38″);
        LODOP.SET_PRINT_STYLEA(16,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(152,584,103,20,”138860016786″);
        LODOP.SET_PRINT_STYLEA(17,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(95,571,112,20,”06775516″);
        LODOP.SET_PRINT_STYLEA(18,”FontName”,”System”);
        LODOP.SET_PRINT_STYLEA(18,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(496,135,183,20,”2008年09月(20080901-20080930)”);
        LODOP.SET_PRINT_STYLEA(19,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(496,572,112,20,”-王府井中央店营”);
        LODOP.SET_PRINT_STYLEA(20,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(311,217,100,20,”678.30″);
        LODOP.SET_PRINT_STYLEA(21,”FontColor”,16711680);
        LODOP.ADD_PRINT_TEXT(311,58,100,20,”费用合计”);
        LODOP.SET_PRINT_STYLEA(22,”FontColor”,16711680);

        LODOP.ADD_PRINT_TEXT(396, 190, 46, 22, validateYear); //有效期 结束 年 
        LODOP.SET_PRINT_STYLEA(6, “FontSize”, 11);
        LODOP.SET_PRINT_STYLEA(6, “Bold”, 1);
        LODOP.ADD_PRINT_TEXT(396, 253, 30, 22, validateMonth); //有效期 结束 月
        LODOP.SET_PRINT_STYLEA(7, “FontSize”, 11);
        LODOP.SET_PRINT_STYLEA(7, “Bold”, 1);
        LODOP.ADD_PRINT_TEXT(396, 304, 32, 22, validateDay); //有效期 结束 日
        LODOP.SET_PRINT_STYLEA(8, “FontSize”, 11);
        LODOP.SET_PRINT_STYLEA(8, “Bold”, 1);

打印预览和打印维护是面向终端用户的,打印维护是指内容无法修改删除、但岗位可以调动,给不同的打印机不同的尺寸打印提供调整职务的可能性。

 其中绝大多数内容依然相比较好精通的,不同的功能调用不同的函数Preview为预览、Setup为珍重、Design为计划。

在面前介绍过《Web打印的缓解方案之普通报表打印》的一片随笔中关系过分外打印控件Lodop,做起套打来感觉仍然挺便宜的,至少地点调整界面不需要协调弄,地点嘛,也提供了机动保存的意义,不需要理会。

    function Preview2() {        
        CreateDataBill();
          LODOP.PREVIEW();        
    };            
    function Setup2() {        
        CreateDataBill();
        LODOP.PRINT_SETUP();        
    };
    function Design2() {        
        CreateDataBill();
        LODOP.PRINT_DESIGN();

 

大体的实现代码如下所示:

 最终附上它的规划界面,其中变化代码功效可以转移用于静态HTML中的内容布局展现,做一定的改动调整就足以用在动态页面中了。分外管用的一个功力。

相关文章