https://www.jq22.com/jquery-info294
如何使用它
将jquery.qrcode.min.js和jquery添加到您的网页中
1
2
| <script src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
|
然后创建一个DOM元素去包含生成qr码。
1
| <div id="qrcode"></div>
|
然后你在此容器中的添加qrcode
1
2
3
4
5
| <script>
jQuery(function(){
jQuery('#qrcode').qrcode("http://abcdxyzk.github.io");
})
</script>
|
就这么简单，您想要的二维码就生成了。
进阶用法
指定二维码的生成方式：
可以在调用函数的同时输入想要的二维码生成方式（table/canvas）。
1
2
3
4
5
6
7
8
9
10
11
| //使用table生成
jQuery('#qrcode').qrcode({
render: "table",
text: "http://abcdxyzk.github.io"
});
//使用canvas生成
jQuery('#qrcode').qrcode({
render: "canvas",
text: "http://abcdxyzk.github.io"
});
|
指定生成二维码的大小：
可以在调用函数的同时输入想要生成二维码的宽度和高度即可指定生成的二维码的大小。
1
2
3
4
5
6
7
8
| //生成100*100(宽度100，高度100)的二维码
jQuery('#qrcode').qrcode({
render: "canvas", //也可以替换为table
width: 100,
height: 100,
text: "http://abcdxyzk.github.io",
correctLevel:3 //二维码纠错级别
});
|
指定生成二维码的色彩样式：
可以在调用函数的同时输入想要生成二维码的前景色和背景色即可指定生成的二维码的色彩样式。
1
2
3
4
5
6
7
| //生成前景色为红色背景色为白色的二维码
jQuery('#qrcode').qrcode({
render: "canvas", //也可以替换为table
foreground: "#C00",
background: "#FFF",
text: "http://abcdxyzk.github.io"
});
|
中文ULR生成方法:
1
| jQuery("#output").qrcode(encodeURI("http://中文中文")); //使用encodeURI进行转码
|
