Using Jquery.qrcode.js to generate a two-dimensional code plug-in _jquery

Two-dimensional code application has penetrated into our life work, you only need to use the phone to the two-dimensional code "sweep" to obtain the corresponding information, to facilitate our understanding of business, shopping, viewing and so on. This article will introduce a jquery based two-dimensional code generation plug-in QRCode, call the plug-in in the page can generate the corresponding two-dimensional code.

1.qrcode is actually through the use of jquery to achieve graphics rendering, drawing, support canvas (HTML5) and table two ways,

GitHub Source Address: Https://github.com/jeromeetienne/jquery-qrcode

Parameter description:

• Render: "Canvas",//Set Rendering mode
• WIDTH:256,//Set width
• HEIGHT:256,//Set height
• Typenumber:-1,//Calculation mode
• correctlevel:qrerrorcorrectlevel.h,//Error Correction level
• Background: "#ffffff",//Background color
• Foreground: "#000000"//Foreground color

2. Use examples:

Plug-in references:

<script src= ". /js/jquery-1.11.3.min.js "></script> 
 

Simple Example 1:

<div id= "code" ></div> 
<script>// 
 Any string generates two-dimensional code 
 //default use canvas Paint 
 $ (' #code '). QRCode ( ' http://blog.csdn.net/u011127019 '); 
</script> 

Simple Example 2:

<div id= "code" ></div> 
<script> 
 //table mode compatible IE low version 
 $ (' #code '). QRCode ({ 
  Render: ' table ', 
  width:100, 
  height:100, 
  text: ' http://blog.csdn.net/u011127019 ' 
 }; 
</script> 

Simple Example 3 (Chinese support):

When we tried to find a two-dimensional code that could not recognize Chinese content, we found that the Jquery-qrcode was encoded in charCodeAt () mode by looking for multi-party data. This method by default will get its Unicode encoding, if there is Chinese content, in the generation of two-dimensional code to convert the string to UTF-8, and then generate two-dimensional code.

<div id= "code" ></div> <script>//If there is Chinese in the content, it is necessary to convert the string to Utf-8 function ToUtf8 (str) {var out in the generation of two-dimensional code money. 
  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 >>) & 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; 
 
 } $ (' #code '). QRCode ({Text:toutf8 (' I am Tianma '), width:150, height:150});  The current micro-letter/Alipay etc. do not recognize the other colors of the two-dimensional code $ (' #code '). QRCode ({Text:toutf8 (' I am Tianma '), width:150, height:150, background: 
' #f00 ', foreground: ' #0f0 '}); </script>  

Example 4:

The value length of the Text property cannot be too long, the maximum number of bytes 10208 
//text string too long micro-letter/Alipay, such as sweeping sweep can not identify, micro-bo identify content more 
//micro Bo sweep a sweep: About 200 words, micro-letter sweep: About 160 words within, Pay for a sweep: about 130 characters within 
$ (' #code '). QRCode ({ 
 Text:toutf8 (' signalr) is a Microsoft. NET Framework Library that the ASP.net team is developing and JQuery Plug-ins, which may be included in later versions of the ASP.net platform. It provides some of the most promising features that are, and are more and more, not currently available, ' 
 width:150, 
 height:150 

I hope this article is helpful to you, using jquery.qrcode.js to generate a two-dimensional code plug-in content is introduced here. I hope you will continue to pay attention to our website!