qrcode其实是通过使用jQuery实现图形渲染，画图，支持canvas（HTML5）和table两种方式，github地址：https://github.com/jeromeetienne/jquery-qrcode
以下是demo：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>Qrcode demo</title> 6 7 <!-- Demo styles --> 8 <style> 9 10 </style> 11 </head> 12 <body> 13 14 <!-- Qrcode JS --> 15 <script src="./jquery-1.10.2.min.js"></script> 16 <script src="./jquery.qrcode.min.js"></script> 17 18 19 <div id="code"></div> <br> 20 <div id="code1"></div> <br> 21 <div id="code2"></div> 22 <!-- Initialize Qrcode --> 23 <script> 24 $('#code').qrcode("http://www.baidu.com"); //任意字符串 25 $("#code1").qrcode({ 26 render: "table", //table方式 27 200, //宽度 28 height:200, //高度 29 text: "www.baidu.com" //任意内容 30 }); 31 $("#code2").qrcode({ 32 render: "canvas", //canvas方式 33 200, //宽度 34 height:200, //高度 35 text: "www.baidu.com" //任意内容 36 }); 37 38 /** 39 * 其实上面的js有一个小小的缺点，就是默认不支持中文。 40 41 这跟js的机制有关系，jquery-qrcode这个库是采用 charCodeAt() 这个方式进行编码转换的， 42 43 而这个方法默认会获取它的 Unicode 编码，一般的解码器都是采用UTF-8, ISO-8859-1等方式， 44 45 英文是没有问题，如果是中文，一般情况下Unicode是UTF-16实现，长度2位，而UTF-8编码是3位，这样二维码的编解码就不匹配了。 46 47 解决方式当然是，在二维码编码前把字符串转换成UTF-8，具体代码如下： 48 */ 49 function utf16to8(str) { 50 var out, i, len, c; 51 out = ""; 52 len = str.length; 53 for(i = 0; i < len; i++) { 54 c = str.charCodeAt(i); 55 if ((c >= 0x0001) && (c <= 0x007F)) { 56 out += str.charAt(i); 57 } else if (c > 0x07FF) { 58 out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F)); 59 out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F)); 60 out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); 61 } else { 62 out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F)); 63 out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F)); 64 } 65 } 66 return out; 67 } 68 </script> 69 </body> 70 </html>
效果图如下：
