<html>
<head>
<meta charset="utf-8">
<title>二维码打印</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<script src="<%=basePath %>resources/components/laydate/laydate.js"></script>
<script language="javascript" src="/jzfw_easyui/ss/js/jquery-1.4.4.min.js" charset="utf-8"></script>
<script language="javascript" src="/jzfw_easyui/ss/js/jquery.jqprint-0.3.js" charset="utf-8"></script>
<style type="text/css">
td{
text-align: center;
}
.layui-input, .layui-textarea, .layui-select {
height: 25px;
line-height: 25px;
border: 1px solid #e6e6e6;
background-color: #fff;
border-radius: 2px;
}
.layui-form-select .layui-input {
padding-right: 0px;
cursor: pointer;
}
</style>
</head>
<body>
<input type="button" onclick="print()" value="点我生成二维码并且打印" style="padding:5px 10px;"/>
<!--<div id="" style="width:380px;height:380px;padding: 15px;"> -->
</div>
<div class="layui-layout layui-layout-admin" id="editDiv">
<div id="code"></div>
</div>
<div id="output" style="width:380px;height:380px;padding: 15px;">
</div>
<div id="fanh" title="二维码" style="width:180px;height:180px;padding: 15px;display: none;text-align: center;"
><img src='' id='myImg' alt="uu" style="height: 160px;width:160px;"/>
</div>
<input type="hidden" id="saleid" name="saleid" value="${sale.id}" />
<script src="/layui/layui.js" charset="utf-8"></script>
<script src="/layui/layuiTable.js" charset="utf-8"></script>
<script src="/jzfw_easyui/ss/js/myUtils.js" charset="utf-8"></script>
<script type="text/javascript" src="/zfw_easyui/ss/js/jquery.qrcode.min.js"></script>
<script language="javascript" src="/jzfw_easyui/ss/js/lodop/LodopFuncs.js" charset="utf-8"></script>
<script>
var LODOP;
var id= $("#saleid").val();
alert(id);
//打印div根据id
var url="<%=basePath%>/front/frontAction!getFishInfo.action?id="+id;//要打印的连接
alert(url);
function print(){
$('#output').empty();
$('#output').qrcode({
width:150,height:150,
correctLevel:0,
render: "canvas",
text:url
});
$("canvas").attr("id","erw");
var canvas = document.getElementById('erw');
var context = canvas.getContext('2d');
var image = new Image();
var strDataURI =canvas.toDataURL("image/png");
document.getElementById('myImg').src = strDataURI;
if (!!window.ActiveXObject || "ActiveXObject" in window){
$('#myImg').css("width", '200px');
$('#myImg').css("height", '200px');
CreateOneFormPage();
LODOP.PREVIEW();
//$("#myImg").jqprint();
/* $("myImg").printArea();*/
}else{
CreateOneFormPage();
LODOP.PREVIEW();
//$("#myImg").jqprint();
}
}
function CreateOneFormPage(){
LODOP=getLodop();
LODOP.PRINT_INIT("打印销售情况二维码");
LODOP.SET_PRINT_STYLE("FontSize",18);
LODOP.SET_PRINT_STYLE("Bold",1);
LODOP.SET_PRINT_PAGESIZE(0,0,0,'A4');
//LODOP.ADD_PRINT_TEXT(50,150,260,39,"销售情况二维码");
LODOP.ADD_PRINT_IMAGE(100,100,200,200,document.getElementById("fanh").innerHTML);
};
<%-- $(function() {// 初始化内容
var url="front/frontAction!getFishInfo.action";
$('#output').empty();
$('#output').qrcode({
width:150,height:150,
correctLevel:0,
text:url
});
}); --%>
/* $('#code').qrcode({
render: 'table',
width: 100,
height: 100,
text: 'http://blog.csdn.net/u011127019'
});
function print(){
$("#editDiv").jqprint();
} */
</script>
</body>
</html>
问题:由于最新谷歌浏览器不支持NP插件,导致LODOP控件无法使用,解决方案可以参照http://blog.sina.com.cn/s/blog_721e77e50102vij3.html
可以直接上官网下载LODOP打印控件及云打印控件一起部署来解决谷歌浏览器不支持LODOP插件问题