Utilisez le plug-in jquery qrcode pour générer le code QR_jquery

Les applications de code QR ont pénétré dans nos vies et notre travail. Il vous suffit de « scanner » le code QR avec votre téléphone portable pour obtenir les informations correspondantes, ce qui nous permet de comprendre les commerçants, de faire des achats, de regarder des films, etc. . Cet article présentera un plug-in de génération de code QR basé sur jquery, qrcode. L'appel de ce plug-in sur la page peut générer le code QR correspondant.
qrcode utilise en fait jQuery pour réaliser le rendu graphique et le dessin, et prend en charge le canevas (HTML5) et le tableau. Vous pouvez obtenir le dernier code ici.

Comment utiliser
1. Ajoutez d’abord le fichier de bibliothèque jquery et le plug-in qrcode à la page.

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="jquery.qrcode.min.js"></script> 

2. Ajoutez le code suivant à la page où le code QR doit être affiché :

<div id="code"></div> 

3. Appelez le plug-in qrcode.
qrcode prend en charge deux méthodes de canevas et de tableau pour le rendu des images. La méthode canevas est utilisée par défaut, qui est la plus efficace, bien entendu, le navigateur doit prendre en charge HTML5. Appel direct comme suit :

$('#code').qrcode("http://www.jb51.net"); //任意字符串 

Vous pouvez également appeler via :

$("#code").qrcode({ 
  render: "table", //table方式 
  width: 200, //宽度 
  height:200, //高度 
  text: "http://www.jb51.net" //任意内容 
}); 

De cette manière, un code QR peut être généré directement sur la page. Vous pouvez utiliser la fonction "scan" de votre téléphone mobile pour lire les informations du code QR.
Reconnaître le chinois
Au cours de l'expérience, nous avons constaté que le code QR avec un contenu chinois ne pouvait pas être reconnu. En recherchant diverses informations, nous avons appris que jquery-qrcode utilise la méthode charCodeAt() pour encoder la conversion. Cette méthode obtiendra son encodage Unicode par défaut. S'il y a du contenu chinois, la chaîne doit être convertie en UTF-8 avant de générer le code QR, puis le code QR sera généré. Vous pouvez convertir des chaînes chinoises grâce aux fonctions suivantes :

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;  
} 

Exemple ci-dessous :

var str = toUtf8("脚本之家！"); 
$('#code').qrcode(str); 

Il existe désormais de nombreux tutoriels sur la façon de créer des codes QR en ligne. Vous devez apprendre à les utiliser de manière flexible et choisir votre méthode préférée pour maîtriser les compétences de création de codes QR.