jquery.qrcode生成二維碼

canvas標籤轉換爲img標籤實現微信長按識別二維碼

//導入文件
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>複製代碼

<div id="qrcode"></div>複製代碼

<script>
    var superior = $('#superiorid').val();

    var url = __URL("APP_MAIN/member/doInvite?&superior="+superior);

    $('#qrcode').qrcode({

        width: 150,

        height: 150,

        text: url
    });

    var mycanvas=document.getElementsByTagName('canvas')[0];

    var img=convertCanvasToImage(mycanvas);

    // canvas.toDataURL 返回的是一串Base64編碼的URL

    $('#qrcode').html(img);//插入圖片

    $('img').css('border', '10px solid #ffffff');//爲二維碼添加白色邊框

    function convertCanvasToImage(canvas) {
    
        var image = new Image();

        image.src = canvas.toDataURL("image/png");// 指定格式

        return image;
    }
    </script>複製代碼

text    設置二維碼內容

render  設置渲染方式 (有兩種方式 table和canvas,默認是canvas)

width   設置寬度

height  設置高度

typeNumber  計算模式    

correctLevel 糾錯等級    

background 背景顏色    

foreground 前景顏色 複製代碼


傳送門javascript

PS:jquery.qrcode生成二維碼內容目前不支持中文css

相關文章
相關標籤/搜索