🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
首先感谢 suflow 的这篇博客 http://suflow.iteye.com/blog/1687396 描述:jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码。此插件是能够独立使用的,体积也比较小,使用gzip压缩后才不到4kb。因为它是直接在客户端生成的条码, 所以不会有图片下载的过程,能够实现快速生成。它是基于一个多语言的类库封装的,也不依赖于其他额外的服务。 ![](https://box.kancloud.cn/b1d671550e127639660e1b74787481ca_376x253.png) 兼容浏览器:IE6+/Firefox/Google Chrome 官方链接:http://jeromeetienne.github.com/jquery-qrcode/ JS 下载:http://www.ijquery.cn/js/qrcode/jquery.qrcode-zh.js 和 http://www.ijquery.cn/js/qrcode/qrcode.js 和 http://www.ijquery.cn/js/qrcode/utf.js 预览: http://www.ijquery.cn/demo/qrcode/index-zh.html 打包下载:http://www.ijquery.cn/demo/qrcode/qrcode.zip * * * * * ## JS引用代码: ~~~ <script type="text/javascript" src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="http://www.ijquery.cn/js/qrcode/utf.js"></script> <script type="text/javascript" src="http://www.ijquery.cn/js/qrcode/jquery.qrcode-zh.js"></script> <script type="text/javascript" src="http://www.ijquery.cn/js/qrcode/qrcode.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#qrcodeTable").qrcode({ render : "table", text : "百度", width:"200", height:"200" }); }); </script> ~~~ ## HTML代码: ~~~ [html] <div id="qrcodeTable"></div> [/html] ~~~ ## 参数说明: ~~~ render : “canvas”, //设置渲染方式,有table和canvas,使用canvas方式渲染性能还是非常不错的,但是如果用table方式,性能不太理想,特别是IE9以下的浏览器 width : 256, //设置宽度 height : 256, //设置高度 text : “http://www.baidu.com”, //设置二维码内容 typeNumber : -1, //计算模式 correctLevel : QRErrorCorrectLevel.H,//纠错等级 background : “#ffffff”,//背景颜色 foreground : “#000000” //前景颜色 ~~~