jQuery-qrcode.js 生成帶Logo 的二維碼

引入文件  jQuery-qrcode.js  jquery

地址:https://blog-static.cnblogs.com/files/kitty-blog/jquery-qrcode.jscanvas

https://blog-static.cnblogs.com/files/kitty-blog/jquery-qrcode.min.jsui

一、在頁面上寫img 標籤 src 爲 Logo 路徑, 如不須要顯示 則隱藏。。如 :spa

1 <img src="~/images/Logo.png" class="hidden" id="myLogo" />

二、頁面上 寫個 div 放 二維碼:code

1  <div id="QRCode"></div>

三、建立 帶Logo 的二維碼 js d代碼:blog

 1 //生成二維碼
 2     function createCode(QrUrl) {
 3         $("#QRCode").qrcode({
 4             render: "canvas", //也能夠替換爲table
 5             minVersion: 1,       // version range somewhere in 1 .. 40
 6             maxVersion: 40,
 7             ecLevel: 'H',        //識別度  'L', 'M', 'Q' or 'H'
 8             left: 0,
 9             top: 0,
10             size: 100,           //尺寸
11             fill: '#000',        //二維碼顏色
12             background: null,    //背景色
13             text: QrUrl,     //二維碼內容
14             radius: 0.1,         // 0.0 .. 0.5
15             quiet: 2,            //邊距
16             mode: 4,
17             mSize: 0.2,          //圖片大小
18             mPosX: 0.5,
19             mPosY: 0.5,
20             label: 'jQuery.qrcode',
21             fontname: 'sans',
22             fontcolor: '#000',
23             image: $('#myLogo')[0]
24         });
25     },
相關文章
相關標籤/搜索