1 <!DOCTYPE html>
2 <html>
3 <head>
4 <script src="jquery-3.3.1.min.js"></script>
5 <script src="jquery-qrcode.js"></script>
6 <!--
7 //样例地址
8 https://larsjung.de/jquery-qrcode/latest/demo/
9 //jquery-qrcode.js下载地址
10 https://github.com/lrsjng/jquery-qrcode
11 -->
12 <style type="text/css">
13 #img-buffer {
14 display: none;
15 }
16 </style>
17 </head>
18 <body>
19 <div id="qrcode"></div>
20 <img src="img/1.jpg" id="img-buffer">
21 <script type="text/javascript">
22 $('#qrcode').qrcode({
23 render: 'canvas', //设置渲染方式，有table和canvas，使用canvas方式渲染性能相对来说比较好
24 minVersion: 1, // version range somewhere in 1 .. 40
25 maxVersion: 40,
26 ecLevel: 'L', //识别度 'L', 'M', 'Q' or 'H'
27 left: 0,
28 top: 0,
29 size: 200, //尺寸
30 fill: '#000', //二维码颜色
31 background: null, //背景色
32 text: 'no text', //二维码内容
33 radius: 0.1, // 0.0 .. 0.5
34 quiet: 2, //边距
35
36 // modes
37 // 0: normal
38 // 1: label strip
39 // 2: label box
40 // 3: image strip
41 // 4: image box
42 mode: 4,
43 mSize: 0.3, //图片大小
44 mPosX: 0.5,
45 mPosY: 0.5,
46
47 label: 'jQuery.qrcode',
48 fontname: 'sans',
49 fontcolor: '#000',
50 image: $("#img-buffer")[0]
51 });
52 </script>
53 </body>
54 </html>
