項目中比較好用的web打印控件——Lodop

項目中比較好用的web打印控件——Lodop

由於公司業務需求，需要控件打印控件，在網上看到了很多打印插件，覺得Lodop打印插件比較好用，下面介紹操作方法：

1、準備工作，下載控件及官方demo

下面給出官方的下載地址：http://www.lodop.net/download.html

2、基本使用

由於Lodop控件是一個exe程序，所以第一次使用的時候，需要提示用戶安裝這個控件（控件大小在2M左右），注意Lodop根據操作系統類型不同（X86還是X64），分爲install_lodop32.exe 和install_lodop64.exe

(1)提示用戶安裝控件

在頁面的head標籤內，寫下如下代碼：

 

注意：/ControlPackage/Lodop 這個目錄是我自己創建的目錄，如果你自己使用，可修改爲自己的目錄

1 2 3 4 5 6 7 8 9 10

function CheckIsInstall() { try { var LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM')); if ((LODOP != null) && (typeof(LODOP.VERSION) != "undefined")) { alert("本機已成功安裝過Lodop控件!\n 版本號:" + LODOP.VERSION); } } catch (err) { //alert("Error:本機未安裝或需要升級!"); } };

具體調用代碼：

<input type="button" value="檢查是否安裝打印控件" onclick="JAVASCRIPT: CheckIsInstall()" />

(2)打印頁面內容

由於我打印的內容是一個form表單下的table表格，所以調用的是ADD_PRINT_TABLE，這個函數，如果大家打印html或者其他可以參考這篇文章——lodop相關參數和講解。

注意：打印的內容的樣式，一定要直接寫在頁面上，不要使用css樣式

下面貼出來打印form1表單的table標籤內容的js代碼。

1 2 3 4 5 6 7 8 9 10 11 12

var LODOP; //聲明爲全局變量 function prn1_preview() { CreateOneFormPage(); LODOP.PREVIEW(); }; function CreateOneFormPage() { LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM')); LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表單一"); LODOP.SET_PRINT_STYLE("FontSize", 14); LODOP.SET_PRINT_STYLE("Bold", 1); LODOP.ADD_PRINT_TABLE("5mm", "0mm", "230mm", "140mm", document.getElementById("form1").innerHTML); };

打印內容：

<input id="btnPrint2" value="打 印" type="button" onclick="javascript: prn1_preview()" />