QRcode.js 二维码制作

GitHub 地址：https://github.com/davidshimjs/qrcodejs

引用：

<script src="/qrcode.js"></script>

基本用法：

<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "https://www.tianlunvip.com");
</script>

选项设置：

var qrcode = new QRCode("test", {
text: "https://www.tianlunvip.com",
width: 128,
height: 128,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});

方法：

qrcode.clear(); // 清除.
qrcode.makeCode("https://tianlunvip.com"); // 重新生成.

HTML 代码：

<input id="text" type="text" value="https://tianlunvip.com" style="width:80%" /><br />
<div id="qrcode"></div>

CSS 代码：

#qrcode {
width:160px;
height:160px;
margin-top:15px;
}

JS 代码：

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();
        }
    });

See the Pen
YzzYJJN by tianlunvip (@tianlunvip)
on CodePen.

转载请注明出处：吖Go博客 » QRcode.js 二维码制作