qrcode生成二維碼，並使用LODOP批量列印
阿新 • • 發佈：2020-08-28
生成二維碼需要引用qrcode.js
1 <div id="qrcode" style="display:none;width:300px;height:300px;"></div> 2 <script src="~/Scripts/qrcode.js"></script>
js程式碼--生成二維碼，：
1 var qrcode = new QRCode(document.getElementById("qrcode"), { 2 width: 300, 3 height: 300,4 render: "canvas", 5 text: “顯示內容” 6 });
使用LODOP列印需要的程式碼：
1 var LODOP = getLodop(); 2 //生成標籤 3 function PrintItemLabel() { 4 5 6 //預覽比例，工具欄，直接列印，寬度，高度 7 LODOP.SET_PRINT_PAGESIZE(1, "70mm", "60mm", ""); //紙張型別（方向、寬、高、名稱） 8 LODOP.SET_PRINT_MODE("POS_BASEON_PAPER", true); //從紙張邊開始計算 9 LODOP.SET_SHOW_MODE("NP_NO_RESULT", true); //相容谷歌瀏覽器 10 11 LODOP.SET_PREVIEW_WINDOW(1, 0, 0, 700, 600, "標籤列印"); //設定預覽視窗（預覽比例，工具欄，直接列印，寬度，高度） 12 13 $.each(rows, function(n, row) { 14 LODOP.NEWPAGEA(); 15 var qrcode = new QRCode(document.getElementById("qrcode"), { 16 width: 300, 17 height: 300, 18 render: "canvas", 19 text: "二維碼掃描顯示內容'" 20 }); 21 $("canvas").attr("id", "erw"); 22 var canvas = document.getElementById('erw'); 23 var context = canvas.getContext('2d'); 24 var image = new Image(); 25 var strDataURI = canvas.toDataURL("image/png"); 26 $("#qrcode").empty(); 27 28 var table = "<table class=\"header\" cellspacing=\"0\" cellpadding=\"2\" border=\"0\" style=\"width:100%;text-align:left;font-family:'宋體';font-weight: bold\">"; 29 table += "<tr><td style=\"text-align:center;font-size:12pt;\"><img src='" + strDataURI + "' style='width:110px;height:110px;'/></td>"; 30 table += "<tr><td style=\"text-align:center;font-size:12pt;\">" + row.Name + "<table>"; 31 32 LODOP.ADD_PRINT_HTM(30, 40, 180, 180, table); 33 34 }); 35 LODOP.PREVIEW(); 36 }
最終頁面
PS:
使用LODOP也可直接生成二維碼：
LODOP.ADD_PRINT_BARCODE(Top,Left,Width,Height,BarCodeType,BarCodeValue);
Width條碼的總寬度，計量單位px（1px=1/96英寸）
Height條碼的總高度（一維條碼時包括文字高度）
BarCodeType條碼的型別（規制）名稱，共有26種
BarCodeValue條碼值
相關內容可參見：http://www.lodop.net/demolist/PrintSample11.html