jQuery 自动生成二维码 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no" />
        <title></title>
        <style type="text/css">
            #qrcode {
                width:160px;
                height:160px;
                margin-top:15px;
            }  
        </style>
    </head>
    <body>
        <input id="text" type="text" value="http://www.baidu.com" /><br />
        <div id="qrcode"></div>
        
        <script src="js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
        <script src="js/qrcode.min.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            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>

 效果预览：

posted @ 2021-01-27 22:18  芳香四溢713051  阅读(355)  评论(0)    收藏  举报