Home >Web Front-end >JS Tutorial >How to generate QR code with jQuery qrcode

How to generate QR code with jQuery qrcode

高洛峰
高洛峰Original
2017-01-20 15:07:561029browse

Nowadays, QR codes are becoming more and more popular. Many web pages will have a QR code, which can be browsed through mobile phones after scanning.

In the past, when doing similar projects, we usually generated images on the web page and then inserted the images into the web page.

You cannot generate a QR code on every page by doing this.

jquery-qrcode is a jquery plug-in that can generate QR codes on the browser side. It is self-contained, less than 4k with minimal compression, and has no image download requests. After introducing this class library, you can easily add QR codes to web pages with just one line of code.

qrcode actually uses jQuery to achieve graphics rendering and drawing, supporting canvas (HTML5) and table. You can go to

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

Get the latest code.

How to use

1. First add the jquery library file and qrcode plug-in to the page

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

2. The QR code needs to be displayed on the page Add the following code:

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

3. Call the qrcode plug-in

qrcode supports two methods of canvas and table for image rendering. The canvas method is used by default, which is the most efficient. Of course, the browser must support html5

Direct call:

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

Advanced attributes:

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

More articles related to the method of generating QR code with jQuery qrcode Please pay attention to PHP Chinese website!


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn