最近项目中有需求生成带参的二维码,考虑过用JAVA后台生成返回前端展示,后面了解到用jquery的qrcode.js插件可以很好现实
引入js:
require.config({ baseUrl : "/", paths: { jquery:'plugin/jquery/jquery-3.1.0.min', qrcode:'plugin/qrcode/qrcode' } }); require( [ 'jquery', 'qrcode' ], function($){ xxxx.. } )
待渲染的dom:
<div id="qrcodeCanvas"></div>
初始化二维码:
$('#qrcodeCanvas').qrcode({ text: "http://h5.sztoda.cn/base/login", background: "#CCC",//背景 foreground: "#FFF",//前景 100,//宽 height: 100,//高 });
值得注意的是,“text”如果是链接且需要自动跳转,只需带上http://开头即可
效果图:
参考:
qrcode.js下载地址 http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js