|
【简介】 jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ，使用它可以很方便的在页面上生成二维条码。 【使用步骤】 普通用法 1. 将jquery.qrcode.min.js和jquery添加到网页中 [HTML] 纯文本查看 复制代码 <script src="jquery-1.10.2.min.js"></script>
<scripttype="text/javascript" src="jquery.qrcode.min.js"></script> 2. 然后创建一个DOM元素去包含生成QRCode二维码码 [HTML] 纯文本查看 复制代码 <div id="qrcode"></div> 3. 初始化 [JavaScript] 纯文本查看 复制代码 <script>
$(function(){
$('#qrcode').qrcode("http://bbs.itheima.com/forum.php?mod=viewthread&tid=386119&extra=");
})
</script> 进阶用法 可以在调用初始化函数的同时输入想要的二维码生成方式（table/canvas）。 [JavaScript] 纯文本查看 复制代码 //使用table生成[/align]
jQuery('#qrcode').qrcode({
render: "table",
text: " [url]http://bbs.itheima.com/forum.php?mod=viewthread&tid=386119&extra=[/url]"
});
//使用canvas生成
jQuery('#qrcode').qrcode({
render: "canvas",
text: " [url]http://bbs.itheima.com/forum.php?mod=viewthread&tid=386119&extra=[/url]"
});可以在调用初始化函数的同时输入想要生成二维码的宽度和高度即可指定生成的二维码的大小 //生成100*100(宽度100，高度100)的二维码 jQuery('#qrcode').qrcode({ render:"canvas", //也可以替换为table width: 100, height: 100, }); [JavaScript] 纯文本查看 复制代码 //生成前景色为红色背景色为白色的二维码
jQuery('#qrcode').qrcode({
render: "canvas", //也可以替换为table
foreground: "#C00",
background: "#FFF",
text: " [url]http://bbs.itheima.com/forum.php?mod=viewthread&tid=386119&extra=[/url]"
});如果你对url地址中带有中文，那么建议使用encodeURI进行转码 [JavaScript] 纯文本查看 复制代码 jQuery("#output").qrcode(encodeURI("http://中文中文"));//使用encodeURI进行转码 【案例演示】
| 
收藏
淘帖
踩
