写在前面的话:我在网上查了一下,有些说qrcode不支持加logo,有些说加img标签,有些又直接加了,我也有点蒙。不加logo这个肯定可行,我是直接加了也能用
我的代码:
1,需要jquery.js和jquery.qrcode.js(我会给出我用的jquery.qrcode.js)
2,jsp:
<div >二 维 码:<span id="qrcode"></span></div>
3,js:
jQuery('#qrcode').qrcode({
text : "www.地址.com",
render : "canvas",//设置渲染方式
width : 112, //设置宽度
height : 112, //设置高度
<span style="background-color: rgb(255, 255, 255);"><span style="color:#ff0000;">src: 'img/default.jpg',</span></span>
typeNumber : -1, //计算模式
correctLevel : QRErrorCorrectLevel.H,//纠错等级
background : "#ffffff",//背景颜色
foreground : "#000000", //前景颜色
});
4,图片路径(我js直接写在了jsp里),目录结构是这样的:
参考文献:
一,Jquery.Qrcode在客户端动态生成二维码并添加自定义Logo - cometwo - 博客园 (支持中文)
http://www.cnblogs.com/libin-1/p/5836108.html
二,jquery.qrcode 生成二维码带logo - whlives - 博客园
http://www.cnblogs.com/whlives/p/5531064.html
额,不知道怎么上传附件。。。我直接整个贴上来吧
jquery.qrcode.min.js
function QR8bitByte(a){this.mode=QRMode.MODE_8BIT_BYTE,this.data=a}function QRCode(a,b){this.typeNumber=a,this.errorCorrectLevel=b,this.modules=null,this.moduleCount=0,this.dataCache=null,this.dataList=new Array()}function QRPolynomial(a,b){var c,d;if(void 0==a.length){throw new Error(a.length+"/"+b)}for(c=0;c<a.length&&0==a[c];){c++}for(this.num=new Array(a.length-c+b),d=0;d<a.length-c;d++){this.num[d]=a[d+c]}}function QRRSBlock(a,b){this.totalCount=a,this.dataCount=b}function QRBitBuffer(){this.buffer=new Array(),this.length=0}var QRMode,QRErrorCorrectLevel,QRMaskPattern,QRUtil,QRMath,i;for(function(a){a.fn.qrcode=function(b){var c,d;return"string"==typeof b&&(b={text:b}),b=a.extend({},{render:"canvas",width:256,height:256,imgWidth:b.width/2.5,imgHeight:b.height/2.5,typeNumber:-1,correctLevel:QRErrorCorrectLevel.H,background:"#ffffff",foreground:"#000000"},b),c=function(){var c,d,e,f,g,h,i,j,k,a=new QRCode(b.typeNumber,b.correctLevel);for(a.addData(b.text),a.make(),c=document.createElement("canvas"),c.width=b.width,c.height=b.height,d=c.getContext("2d"),b.src&&(e=new Image(),e.src=b.src,e.οnlοad=function(){d.drawImage(e,(b.width-b.imgWidth)/2,(b.height-b.imgHeight)/2,b.imgWidth,b.imgHeight)}),f=b.width/a.getModuleCount(),g=b.height/a.getModuleCount(),h=0;h<a.getModuleCount();h++){for(i=0;i<a.getModuleCount();i++){d.fillStyle=a.isDark(h,i)?b.foreground:b.background,j=Math.ceil((i+1)*f)-Math.floor(i*f),k=Math.ceil((h+1)*f)-Math.floor(h*f),d.fillRect(Math.round(i*f),Math.round(h*g),j,k)}}return c},d=function(){var d,e,f,g,h,i,c=new QRCode(b.typeNumber,b.correctLevel);for(c.addData(b.text),c.make(),d=a("<table></table>").css("width",b.width+"px").css("height",b.height+"px").css("border","0px").css("border-collapse","collapse").css("background-color",b.background),e=b.width/c.getModuleCount(),f=b.height/c.getModuleCount(),g=0;g<c.getModuleCount();g++){for(h=a("<tr></tr>").css("height",f+"px").appendT