js生成二维码
2017/9/28 23:01:34
目的:
他人可以扫描二维码来访问某个网址。
插件:
生成二维码的js库有:
QRcode.js、jquery.qrcode.js等
QRcode.js使用方式
QRcode.js的项目地址为:https://github.com/davidshimjs/qrcodejs 下载 链接:http://pan.baidu.com/s/1bo882Fd 密码:r435
使用方式: 首先引用jquery.min.js
方式1:
<div id="qrcode"></div> <script type="text/javascript"> new QRCode(document.getElementById("qrcode"), "http://jindo.dev.naver.com/collie"); </script>
方式2:
<div id="qrcode"></div> <script type="text/javascript"> var qrcode = new QRCode(document.getElementById("qrcode"), { text: "http://jindo.dev.naver.com/collie", width: 128, height: 128, colorDark : "#000000", colorLight : "#ffffff", correctLevel : QRCode.CorrectLevel.H }); </script>
重新生成二维码:
qrcode.clear(); qrcode.makeCode("http://naver.com");
jquery.qrcode.js的使用方式
-
引用jquery.min.js、utf8.js、jquery.qrcode.js。下载 链接:http://pan.baidu.com/s/1mhIz924 密码:6n5k
-
在页面中使用如下脚本
var url = location.href; $("#qrcode").qrcode({ render : "canvas", //设置渲染方式,有table和canvas,使用canvas方式渲染性能相对来说比较好 text: url, //扫描二维码后显示的内容,可以直接填一个网址,扫描二维码后自动跳向该链接 width : "120", //二维码的宽度 height: "120", //二维码的高度 background : "#ffffff", //二维码的后景色 foreground: "#07a0e1", //二维码的前景色 src: '/images/useravatar.svg' //二维码中间的图片 });
-
完成
其它参考资源:
http://backtonaturedemo.github.io/frontend/demo/qrcode/demo.html
qrgen插件
扫码分享
版权说明
作者:SQBER
本文版权归作者所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
{0}
{5}
{1}
{2}回复
{4}
*昵称:
*邮箱:
个人站点:
*想说的话: