原文：https://www.cnblogs.com/izhiniao/p/4160117.html
官網：http://www.mtsoftware.cn/demo.html
先看效果圖 ：
lodop插件 需要安裝
實現打印的前提條件
去官網下載幾個js包 ： http://www.lodop.net/download.html 添加到項目中
圖片如下：
把下面這段代碼加入到 web 前端需要打印功能頁的相應位置
<script language="javascript" src="LodopFuncs.js"></script>
<object id="LODOP_OB" 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>
我自己封裝的打印js代碼(封裝成 table 格式的數據 )
1 function prn1_preview() { 2 var LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM')); 3 LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_打印表格"); 4 5 var theads = "<thead ><tr><th width='300px'>菜名</th><th width='50px'>份數</th><th width='50px'>價格</th><th width='150px'>姓名</th><th width='150px'>時間</th></tr></thead>" 6 var tableBodyStar = "<table border='1'>"; 7 var tableBodyEnd = "</table>"; 8 var tableHead = "<caption style='width:200px;'>點餐列表</caption>" 9 10 var tableBody; 11 12 $(LodopValue).each(function () { 13 14 var menuname = "<tr><th width='300px'>" + this.menu_name; 15 var listnumber = "</th><td width='50px'>" + this.list_number; 16 var clistprice = "</td><td width='50px'>" + this.clist_price; 17 var employeeloginName = "</td><td width='150px'>" + this.employee_loginName; 18 var clisttime = "</td><td width='150px'>" + timeS(this.clist_time); 19 // alert(menuname); 20 tableBody += menuname + listnumber + clistprice + employeeloginName + clisttime + "</td></tr>"; 21 // alert(tableBody); 22 }); 23 24 var t = tableBodyStar; 25 t += tableHead; 26 t += theads; 27 t += tableBody; 28 t += tableBodyEnd; 29 30 LODOP.ADD_PRINT_HTM(60, 20, 800, 1000, t ); 31 LODOP.PREVIEW(); 32 };
注意： 上面的 LodopValue 是我定義的一個全局變量，是datagrid 里面的數據 ：
onLoadSuccess: function (data)
{
var rows = data.rows;
}
LodopValue = rows; // 打印的數據主要是 rows中的數據