Use jquery.qrcode to generate QR code

The qrcode in jQuery can generate a QR code according to the relevant content. This kind of development has already penetrated into our life. How to use qrcode for development in jQuery?

1. Introduce the qrcode plugin in jQuery .

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

2. Write a location to store the QR code:

<style>
	.align-center{
		width:250px;
		margin:0 auto;
	}
	</style>

<div id="qrcode" class="align-center"></div>  

3. Call qrcode to generate the relevant QR code:

        <script type="text/javascript">  
	      jQuery('#qrcode').qrcode({
	    width: 250,height: 250,correctLevel:0,text: "ABCDEFG"
	});

  If it is the data passed from the java background:

text： "${signB}"

Among them, signB is the data (English characters) passed from the background.

Note 1: The above is the transmission of English characters in the background, and Chinese cannot be recognized because jquery-qrcode uses charCodeAt() for encoding conversion.

So Chinese characters need to convert the string to UTF-8, and then generate the QR code.

    The method to convert to utf-8: (this is copied over)

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

application:

var str = toUtf8("The generated QR code contains Chinese characters test test test");
 $('#code').qrcode(str);