WEB套打可選方案不多，理想的更少，利用免費控件Lodop+JavaScript實現(xiàn)精確套打，算是較為經(jīng)典的選擇。這種方案其實比較簡單，利用一個htm文件就可以實現(xiàn)模板設計過程，幾乎是“空手套”式的開發(fā)，但理解這幾個步驟還是需要點時間，下面一步步詳細演示說明：

第一步：建立一個空白的模板設計文件

把以下超文本代碼復制到一個本地htm文件中:

本文模擬EMS特快專遞單的程序開發(fā)，文件起名為printEMS.htm，權(quán)且稱它為模板設計文件。

第二步：用瀏覽器打開該文件

    在本地文件夾中雙擊該文件就可以打開，但在進入設計之前，你的機器需要安裝Lodop，如果還沒安裝過，

請在如下地址下載安裝文件(找那個install_lodop32.exe文件，Lodop是一個1M左右的小文件)：

http://www.mtsoftware.cn/download.html

或http://www.c-lodop.com/download.html

第三步：準備設計

    成功安裝Lodop之后再次打開模板設計文件printEMS.htm，點擊其中“模板設計”鏈接，就彈出如下空白的打印設計窗口：

   為了盡快定位模板中的數(shù)據(jù)位置，你需要做一張票據(jù)掃描圖作為背景，當然沒有掃描圖也能完成，只是需要多摸索幾次，費點時間而已。

   下面是我做的EMS掃描圖，你把該圖另存成一個jpg文件，以便我們一起完成后面的演示步驟。

第四步：裝載背景圖并調(diào)整圖片大小

在打印設計窗口，點下圖所示的“裝載背景圖...”菜單，調(diào)入以上保存的EMS圖片文件。

   裝載背景圖后，點上圖所示的“調(diào)整背景圖...”菜單，彈出下圖“背景圖調(diào)整”窗口，設定其中的圖片寬度為209mm,高度113mm會自動變化。

   這個寬度值是我測量實際票據(jù)得來的。如果掃描圖是按1:1比例獲得的，那么調(diào)整背景圖這一步就免了，當然要做點這點很難，所以最好還是在這里直接設置具體尺寸反倒簡單。

第五步：添加數(shù)據(jù)內(nèi)容，開始打印測試

     點下圖所示“插入文本項”菜單，添加打印內(nèi)容，內(nèi)容項可以拖拉或精細調(diào)整，基本對準之后，點擊“預覽”按鈕（注意旁邊的“打印”按鈕是收費功能，紙上會有水印，而“預覽時的打印”按鈕是完全免費的，我們用后者）。

    把內(nèi)容打印到薄一點的白紙上，然后在陽光下與真實票據(jù)透亮對比，以最左最上的某個內(nèi)容為基準，其它內(nèi)容遠近調(diào)整，如此反復測試直到所有內(nèi)容相互位置都對準。

    這一步先做到內(nèi)容之間的相互位置對準，等下一步處理整體位置。

第六步：整體對準

    由于打印機左邊距或上邊距不一定是零或票據(jù)邊緣有誤差，所以盡管第五步打印出來的內(nèi)容相互之間位置是準確的，但打印到真實票據(jù)上仍會整體偏離一些，需要進行整體位置調(diào)整。

   點擊下圖紅圈所示的“紙釘”按鈕，“紙釘”彈起后，整個設計版面就可以上下左右調(diào)整了，然后按上一步的辦法打印測試，直到整體對準成功。為了避免浪費票據(jù)，打印時仍可用薄白紙測試，注意此時透光對照時，紙張的左邊沿和上邊沿要與票據(jù)對齊，通過觀察內(nèi)容的位置來判斷是否整體對準。

第七步：生成打印模板的程序代碼

    套打測試成功后，點擊第五步圖中所示的“生成程序代碼”菜單，出現(xiàn)下圖結(jié)果，這些代碼就是我們需要的模板程序代碼，把他們復制出來，準備融合到你的頁面程序中使用。

第八步：完成打印模板設計文件

想不想知道WEB套打有啥感覺？好，我們先做一個靜態(tài)WEB頁面爽一下：把第七步生成的程序代碼，

插入替換第一步的空白設計文件CreatePrintPage函數(shù)內(nèi)，變成如下內(nèi)容:

把以上內(nèi)容復制到另外一個htm文件printEMS_OK.htm中，雙擊打開它，點其中的打印預覽，就可以實現(xiàn)簡單的WEB套打了。

   以上八步基本完成了模板設計，并實現(xiàn)靜態(tài)頁面套打，但要把模板代碼融合到實際的WEB程序中，還需要做些工作。

第九步：模板程序代碼的使用

把以上CreatePrintPage函數(shù)進行簡單改造，原函數(shù)如下：

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,"內(nèi)件品名");
    LODOP.ADD_PRINT_TEXT(290,258,100,20,"內(nèi)件數(shù)量");
    LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人電話");
    LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人電話");
};

把其中的打印內(nèi)容提出來做為變量參數(shù)，函數(shù)改成如下樣式：

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);      //內(nèi)件品名
    LODOP.ADD_PRINT_TEXT(290,258,100,20,strNJSL);     //內(nèi)件數(shù)量
    LODOP.ADD_PRINT_TEXT(92,245,100,20,strJJRDH);     //寄件人電話
    LODOP.ADD_PRINT_TEXT(90,608,75,20,strSJRDH);      //收件人電話
};

這個改造后的JS函數(shù)還是很好理解的，無論寫入js文件還是直接嵌在頁面內(nèi)都簡單易用。

如果你改變了內(nèi)容的字體、大小、粗斜體等格式，代碼還會多一些，但總體來說比較簡潔。

第十步：設置紙張高度，實現(xiàn)連續(xù)套打

多數(shù)套打業(yè)務的票據(jù)是連續(xù)紙，需要精確地分頁，從而保證連續(xù)多頁打印不偏移，

為此以上代碼還要在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,"內(nèi)件品名");
    LODOP.ADD_PRINT_TEXT(290,258,100,20,"內(nèi)件數(shù)量");
    LODOP.ADD_PRINT_TEXT(92,245,100,20,"寄件人電話");
    LODOP.ADD_PRINT_TEXT(90,608,75,20,"收件人電話");
};

   其中209mm這個紙寬參數(shù)意義不大，主要是113mm這個高度參數(shù)，它決定了每頁的走紙距離，對連續(xù)打印影響很大。這個值是我測量實際票據(jù)高度得來的，包含紙張之間的撕孔間隙。理想的測量方式，是若干頁連起來一起測量取其平均高。

   加入紙高控制后的打印預覽如下，你可以連續(xù)打印兩頁內(nèi)容到同一張長一點的白紙上，測試對照一下看看。把以上加入SET_PRINT_PAGESIZE語句的代碼復制進第三個htm文件printEMS_OKM.htm試試。假如從第二頁開始，內(nèi)容向下偏移，說明紙張高度設置比實際票據(jù)大，就減小113mm這個參數(shù)值，否則增大它，這個參數(shù)可以精確到0.1mm。

第十一步：讓操作者自己調(diào)整位置

    以上十步實現(xiàn)的套打可以很精確，但都是以當前打印機為前提。如果你的打印程序要面對許多種類型的打印機，甚至一些未知的打印機類型，那么“打印維護”功能會很有用處。你可以根據(jù)情況在程序中把該功能授權(quán)給最終操作者或現(xiàn)場技術(shù)維護人員，讓使用者自己來調(diào)整打印位置，以適應各種類型的打印機。

   打印維護的指令語句是PRINT_SETUP，進入包含該功能的在線文件PrintEMS_OKMSetup.htm,先在打印維護中調(diào)整一下打印內(nèi)容或整體位置，點“應用”按鈕。關閉瀏覽器后重新打開，進入“打印預覽”，看看是否有關聯(lián)變化。下圖是打印維護界面，其中能看到“應用”按鈕和“恢復整體缺省”按鈕的位置。

以上拙筆語無倫次，請各位笑納！！

本文參考如下資料：

http://www.c-lodop.com/LodopDemo.html

或 http://www.mtsoftware.cn/LodopDemo.html