Qrcode.js: Using JavaScript to generate two-dimensional code

What is Qrcode.js?

Qrcode.js is a JavaScript library for generating two-dimensional code. This is done primarily by getting the tags of the DOM and then drawing from the HTML5 Canvas, without relying on any libraries.

Basic usage

<div id = "QRCode" ></div><script type= "text /javascript ">new  Qrcode (document. Getelementbyid "QRCode"  "http://www.runoob.com" );  //set the link to generate the QR code </SCRIPT>   

Or use some optional parameter settings:

VarQRCode= New QRCode("Test", { Text:  "http://www.runoob.com" , Width: 128 , Height: 128 , Colordark :  "#000000" , Colorlight :  "#ffffff ", Correctlevel :  Qrcode. Correctlevel. H               

We can also use the following methods:

QRCode.  Clear();  Clear the Code qrcode.  Makecode("http://www.w3cschool.cc");  Generate another two-dimensional code          

Browser support

Browsers that support this library are: ie6~10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows mobile, etc.

Instance Code HTML code

<inputid="text"type="text"value="http://www.runoob.com"/> <br/><divid="QRCode"></div>     

CSS Code

#qrcode {width:160px; height:160px; margin-top:15px;} 

JavaScript Code

VarQRCode= New QRCode("QRCode");functionMakecode() { VarEltext=Document.getElementById("Text"); If (!Eltext.Value) {Alert("Input a text");Eltext.Focus(); Return; }QRCode.Makecode(Eltext.Value);}Makecode();$("#text").On("Blur", function () { Makecode (); on (, function  (e { if  (e. KeyCode == 13)  { Makecode (); }});           

Try it?

Resources download

QRCode Library and example download:qrcodejs-04f46c6.zip

Github Address:Https://github.com/davidshimjs/qrcodejs

Qrcode.js: Using JavaScript to generate two-dimensional code