1. First add the jquery library file and the QRCode plugin to the page.
<script type= "Text/javascript" src= "jquery.js" ></script><script type= "Text/javascript" src= " Jquery.qrcode.min.js "></script>
2. Add the following code where you want the QR code to appear in the page:
<div id= "Code" ></div>
3, call QRCode plug-in.
QRCode supports canvas and table two ways of rendering pictures, the default use of canvas, the most efficient, of course, the browser supports HTML5. The direct invocation is as follows:
$ (' #code '). QRCode ("http://www.codesky.net"); Arbitrary string
You can also call it in the following ways:
$ ("#code"). QRCode ({render: "table",//table mode width:200,//Width height:200,//Height text: "www.codesky.net"//any Content});
In this way, a QR code can be generated directly from the page, and you can read the QR code information using the "sweep" function of your phone.
Identify Chinese
When we tried to find the two-dimensional code that did not recognize the Chinese content, we found that the Jquery-qrcode was encoded by the charCodeAt () method. This method will get its Unicode encoding by default, and if it has Chinese content, it will convert the string to UTF-8 before generating the QR code, and then generate the QR code. You can use the following functions to convert Chinese strings:
function ToUtf8 (str) { var out, I, Len, C; out = ""; len = str.length; for (i = 0; i < len; i++) { c = str.charcodeat (i); if ((c >= 0x0001) && (c <= 0x007F)) {out + = Str.charat (i); } else if (C > 0x07ff) {out + = S Tring.fromcharcode (0xE0 | ((c >> b) & 0x0F)); Out + = String.fromCharCode (0x80 | ((c >> 6) & 0x3F)); Out + = String.fromCharCode (0x80 | ((c >> 0) & 0x3F)); } else { out + = String.fromCharCode (0xC0 | ((c >> 6) & 0x1F)); Out + = String.fromCharCode (0x80 | ((c >> 0) & 0x3F);} } return out; }
The following example:
var str = ToUtf8 ("I Love You"); $ (' #code '). QRCode (str);
Using Jquery.qrcode to generate two-dimensional code