首页 > 代码库 > h5开发app之在线生成二维码
h5开发app之在线生成二维码
h5通过jquery和qrcode在线生成二维码
首先我们需要下载一个qrcode.js文件，然后依次引入jquery和qrcode文件。
1、创建一个输入框以便做演示使用：
<input id="text" type="text" value="http://www.baidu.com" style="width:80%" />
2、创建一个div以用来放置二维码图片（div的id定义为“qrcode”）：
<div id="qrcode" style="width:100px; height:100px; margin-top:15px;"></div>
3、插入js代码：
1 var qrcode = new QRCode(document.getElementById("qrcode"), { 2 width : 100, 3 height : 100 4 }); 5 6 function makeCode () { 7 var elText = document.getElementById("text"); 8 9 if (!elText.value) {10 alert("Input a text");11 elText.focus();12 return;13 }14 15 qrcode.makeCode(elText.value);16 }17 18 makeCode();19 20 $("#text").21 on("blur", function () {22 makeCode();23 }).24 on("keydown", function (e) {25 if (e.keyCode == 13) {26 makeCode();27 }28 });29 </script
这样就可以，在线生成二维码了！
下图就是我们的代码效果图，试试用手机扫描下会不会跳转到百度首页。
h5开发app之在线生成二维码
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。