Use jquery. qrcode. js to generate a QR code. jquery. qrcode. js

Use jquery. qrcode. js to generate a QR code. jquery. qrcode. js

Functions of QR code

1) scan the mobile device to "take away" and read it (that is, generate a QR code for the URL)

2) information can be transmitted (simply generating a string with a QR code)

Third-party open source Library

Project Source: https://github.com/jeromeetienne/jquery-qrcode

Qrcode. js implements the core function library of QR code

Jquery. qrcode. js uses jquery to encapsulate the core function library. It is actually used for drawing (canvas and table are supported ).

Usage

1) introduce the jquery Library

2) Introduce qrcode. js

3) Introduce jquery. qrcode. js

4) Write

Var str = "http://www.baidu.com"; // var str = "Hello World"; // var str = "adding a function for Chinese"; // var str = toUtf8 (str ); // some functions are used to solve Chinese garbled characters $ ("# qrcode "). qrcode ({render: "canvas", // sets the rendering mode. The value is "canvas" or "table", and the value is omitted as "canvas" text: str, // The only required parameter. The width of the QR code is 200, // The width is 256 pxheight: 200, // The height is 256 pxbackground: "# fff ", // The background color of the QR code, which is omitted as # fffforeground: "#0f0" // The foreground color of the QR code, which is omitted as #000

Solve Chinese garbled characters

Jquery. qrcode. js adopts charCodeAt () for encoding and conversion. By default, this method obtains its Unicode encoding. Therefore, Chinese characters are garbled. The solution is to put the following function at the end of qrcode. js.

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 += String.fromCharCode(0xE0 | ((c >> 12) & 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;  }

Jqueryqrcodeminjs is used to generate a QR code. A js error occurs when a LAN ip address is used for access. The object does not support the getcontext () method or attribute.

The security mechanism of the browser prevents scripts from running locally.
 
How to control the qr code size is ^ BQ (qr code) ^ XA ^ BY2, 2, 70 ^ BQN, 2, 10 ^ FDMM, AAC-42 ^ FS ^ XZ

1. Generated Based on jquery. qrcode. min. js plug-in
Advantage: it is generated based on the jquery. qrcode. min. js plug-in, which is stable and efficient.
Disadvantage: you cannot set or control the size of the generated QR code.

2. Download The jquery. MyQRCode. js plugin,
Advantage: You can customize your own size.
Disadvantage: this QR code is based on chart.googleapis.com/chart? Chs = {size} & cht = qr & chlorophyll = {content} & choe = {encoding} This URL is generated. It only communicates with js encapsulation and is highly dependent.

Hope to help you.