演示： https://lanleilin.github.io/lanTools/generateQRcode/qrCode.html
代码地址： https://github.com/lanleilin/lanTools/tree/master/generateQRcode
方法，在html中引入qrCode.js即可：
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> <script src="./js/qrCode.js"></script> <style> * { padding: 0; margin: 0; } .box { width: 100vw; height: 100vh; overflow: hidden; background: lightgray; display: flex; justify-content: center; align-items: center; } </style> </head> <body> <div class="box"> <div class="container"> <div id="qrcode"> </div> <input type="text" id="getValue" placeholder="请输入" /> <button id="send">生成验证码</button> <div> <input type="number" id="getWidth" placeholder="大小(默认120)" /> </div> </div> </div> <script> window.onload = function() { function generate(num) { this.w = num; var that = this; this.qrcode = new QRCode(document.getElementById("qrcode"), { that.w, //设置宽高 height: that.w }); this.url = document.getElementById("getValue").value ? document.getElementById("getValue").value : "say hello"; this.qrcode.makeCode(this.url); } function foo() { this.getWidth = document.getElementById('getWidth').value.slice(0, 3); this.w = parseInt(this.getWidth) ? parseInt(this.getWidth) : 120; new generate(this.w); let _this = this; document.getElementById("send").addEventListener('click', function() { document.getElementById('qrcode').innerHTML = ''; _this.getWidth = document.getElementById('getWidth').value.slice(0, 3); _this.w = parseInt(_this.getWidth) ? parseInt(_this.getWidth) : 120; new generate(_this.w); }) } new foo(); } </script> </body> </html>