代码改变世界

qrcode插件生成二维码

2019-03-20 14:04  .net小跟班（杜）  阅读(228)  评论(0)  编辑  收藏  举报 
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>EmpIndex</title>
    <link href="~/Content/bootstrap-3.3.7/css/bootstrap.css" rel="stylesheet" />
    <script src="~/jquery类库/jquery-3.1.1.js"></script>
    <script src="~/jquery类库/jquery.qrcode.min.js"></script>
</head>
<body>
    <table>
        <tr>
            <td>请输入文字内容：</td>
            <td>
                <input id="txtCount" type="text" />
            </td>
            <td>
                <input id="Button1" type="button" value="生成" onclick="save()" />
            </td>
        </tr>
    </table>
    <div id="code"></div>
</body>
</html>
<script>
    //如果内容中有中文，在生成二维码钱就要把字符串转换成utf-8  
    function toUtf8(str) {
        var out, i, len, c;
        out = "";
        len = str.length;
        for (i = 0; i < len; i++) {
            c = str.charCodeAt(i);
            if ((c >= 0x0001) && (c <= 0x007F)) {
                out += str.charAt(i);
            } else if (c > 0x07FF) {
                out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
                out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
                out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
            } else {
                out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
                out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
            }
        }
        return out;
    }
    function save() {
        var txt = $("#txtCount").val();
        //就目前 微信/支付宝等 不识别其他颜色的二维码  
        $('#code').qrcode({
            text: toUtf8(txt),
            width: 150,
            height: 150,
            background: '#f00',
            foreground: '#0f0'
        });  
    }
    
</script>