jquery.qrcode.min.js生成二維碼

jquery.qrcode.min.js是一款能夠生成二維碼的插件,使用前提是先引入jquery,由於jquery.qrcode.min.js依賴jquery。javascript

基本用法html

1.引入jsjava

    <script src="js/jquery-3.1.1.min.js"></script>
    <script src="js/jquery.qrcode.min.js"></script>

2.構建容器jquery

 <div class="app"></div>

3.生成二維碼canvas

    $(".app").qrcode({
        render:"canvas",
        width:400,
        height:400,
        text:"http://www.cnblogs.com/jiangcheng-langzi/"
    });  

這樣,一個二維碼就生成了,經過掃二維碼,能夠方便的訪問本博客。瀏覽器

拓展講解app

(1)qrcode生成二維碼有兩種方式:table和canvas。編碼

table方式:會生成許多代碼,黑白相間的是一個個td,總共是37 x 37個格子,通常選擇這種方式是爲了兼容不支持canvas的瀏覽器spa

canvas方式:生成的二維碼其實使用的是canvas繪圖,能夠另存爲圖片格式插件

(2)qrcode默認的寬高均爲256px

(3)qrcode採用的是charCodeAt() 進行編碼轉換,而這個方法默認會獲取它的Unicode編碼,因此若是text包含中文,須要使用encodeURI()轉碼。

(4)此外,能夠經過屬性foreground和background指定二維碼的前景色和背景色

相關文章
相關標籤/搜索