代码:
<!DOCTYPE html> <html lang="en" style="height: 99%"> <head> <meta charset="UTF-8"> <title>二维码生成</title> <style> #qrcode { 160px; height:160px; margin-top:15px; } </style> </head> <body style="height: 100%"> <input id="text" type="text" value="zhaozhou"><br/> <div id="qrcode"></div> <script src="http://p8sv0x8g6.bkt.clouddn.com/jquery-2.1.1.min.js"></script> <script src="http://p8sv0x8g6.bkt.clouddn.com/qrcode.min.js"></script> <script> var qrcode = new QRCode("qrcode"); function makeCode () { var elText = document.getElementById("text"); if (!elText.value) { alert("Input a text"); elText.focus(); return; } qrcode.makeCode(elText.value); } makeCode(); $("#text").on("blur", function () { makeCode(); }). on("keydown", function (e) { if (e.keyCode == 13) { makeCode(); } }); </script> </body> </html>
效果图: