1. 程式人生 > >使用jatoolsPrinter最新免費版實現套打

使用jatoolsPrinter最新免費版實現套打

因為目前專案需要實現繳費憑證套打,考慮使用jatoolsPrinter的功能,但是公司不肯掏錢買付費版,只能使用免費版了。廢話不說了,進入正題。

以下程式碼引入外掛

<OBJECT  ID="jatoolsPrinter" CLASSID="CLSID:B43D3361-D075-4BE2-87FE-057188254255"
      codebase="/test/plugin/jatoolsPrinter.cab#version=8,6,0,0" width="0" height="0">
 </OBJECT>
codebase是cab包的路徑 根據自己的專案引入即可,以我的工程為例 test是我的專案名 plugin是WEB-INF下的一個資料夾,cab放在此資料夾下

以下是列印方法

function doPrint() {
    myDoc = {
     settings: {
               pageWidth: 2100,
               pageHeight: 1400,
               orientation: 2},//2代表橫向列印
        documents: document,
     	marginIgnored:true,
        dragDesigner: {viewSource:true},
        settingsID: 'mydoc3',
        classesReplacedWhenPrint: new Array('.only_for_print{display:block}'),
        copyrights: "傑創軟體擁有版權  www.jatools.com" //一定要加
    }
    var jatoolsPrinter = document.getElementById("jatoolsPrinter");
    jatoolsPrinter.printPreview(myDoc);
}

其次是div部分了

<input type="button" value="列印預覽" onClick="doPrint();">
<div id="page1" class='only_for_print pagestyle' style='width:210mm;height:140mm;position:relative;'>
	<img class='screen-only'  src="/images/changquanchu.jpg" style="position:absolute;width:100%;height:100%"/>
			<div id='f1' draggable='true' class='f1'>專案編號</div>
			<div id='f2' draggable='true' class='f2'>建設單位</div>
			<div id='f3' draggable='true' class='f3' >聯絡單編號</div>
			<div id='f4' draggable='true' class='f4'>專案性質</div>
			<div id='f5' draggable='true' class='f5'>增加面積</div>
			<div id='f6' draggable='true' class='f6' >專案名稱</div>
			<div id='f7' draggable='true' class='f7'>許可證面積</div>
			<div id='f8' draggable='true' class='f8'>專案地址</div>
			<div id='f9' draggable='true' class='f9'>許可證證號</div>
			<div id='f10' draggable='true' class='f10'>補繳面積</div>
			<div id='f11' draggable='true' class='f11'>補繳金額</div>
			<div id='f12' draggable='true' class='f12'>經辦人</div>
			<div id='f13' draggable='true' class='f13'>領單人</div>
			<div id='f14' draggable='true' class='f14'>2016</div>
			<div id='f15' draggable='true' class='f15'>09</div>
			<div id='f16' draggable='true' class='f16'>08</div>
			<div id='f17' draggable='true' class='f17'>編號</div>
			<div id='f18' draggable='true' class='f18'>建設單位</div>
			<div id='f19' draggable='true' class='f19'>聯絡單編號</div>
			<div id='f20' draggable='true' class='f20'>專案性質</div>
			<div id='f21' draggable='true' class='f21'>增加面積</div>
			<div id='f22' draggable='true' class='f22'>專案名稱</div>
			<div id='f23' draggable='true' class='f23'>許可證面積</div>
			<div id='f24' draggable='true' class='f24'>專案地址</div>
			<div id='f25' draggable='true' class='f25'>許可證證號</div>
			<div id='f26' draggable='true' class='f26'>聯絡人</div>
			<div id='f27' draggable='true' class='f27'>聯絡電話</div>
			<div id='f28' draggable='true' class='f28'>2016</div>
			<div id='f29' draggable='true' class='f29'>09</div>
			<div id='f30' draggable='true' class='f30'>08</div>
</div>

f1-f30是我需要套打的資料,img裡面是我要套打的底圖,通過絕對定位將資料定位在底圖上就實現套打了,簡短起見我就貼部分css了,這要根據你的底圖調整。

.f1{left:690px;top:154px}/* 專案編號 */
...
.f30{left:289px;top:198px}/* 建設單位 */

現在說幾點需要注意的地方:

1:如果你需要套打的是word 你可以將你的word轉成圖片 然後將此圖片做為底圖按照上面方式實現即可。word自帶的虛擬印表機可以實現,但是我試了好像一般的office都沒帶安裝包。我用是FinePrint轉換的。

2:我上面的比例是A4列印,'width:210mm;height:140mm' 如果你不是A4列印 需要根據你實際的列印大小調整。

OK 到此為止 接下來就是你們操刀實踐的時候了。