qrcode生成二维码

代码:

<!DOCTYPE html>
<html lang="en" style="height: 99%">
<head>
    <meta charset="UTF-8">
    <title>二维码生成</title>
    <style>
        #qrcode {
            width: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>

  效果图:

猜你喜欢

转载自www.cnblogs.com/zhaozhou/p/9758952.html