jquery-qrcode 二維碼生成
阿新 • • 發佈:2018-11-30
jquery-qrcode-0.14.0.js下載
程式碼:
<html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <script src="jquery-3.3.1.min.js"></script> <script src="jquery-qrcode-0.14.0.js"></script> </head> <body style="background-color:rgb(238,238,238)"> <div id="container"><canvas width="400" height="400"></canvas></div> </body> <script> 'use strict'; var jq = window.jQuery; function updateQrCode() { var options = { //渲染方法: 'canvas', 'image' or 'div' render: 'canvas', //錯誤糾正等級: 'L', 'M', 'Q' or 'H' ecLevel: 'H', minVersion: 1, //二維碼 顏色或影象元素 只能接受16進位制的 顏色引數 fill: '#000', //背景顏色或影象元素,NULL用於透明背景的 只能接受16進位制的 顏色引數 background: '#fff', // fill: jq('#img-buffer')[0], // 如果在現有畫布上繪製畫素偏移 left: 0, top: 0, // 生成二維碼的 URL text: "https://www.baidu.com/", size: 200, //角半徑相對於模組寬度:0-0.5 radius: 0.5, //二維碼顯示的 內邊距 quiet: 1, // modes : // 0: 正常 只顯示二維碼 // 1: 標籤條 // 2: 標籤盒 // 3: 圖片條 // 4: 圖片盒 mode: 0, //modes 大小 相對於 size 的百分比 mSize: 0.1, //modes 顯示位置 mPosX: 0.5, mPosY: 0.5, label: '',//標籤內容 fontname: "sans",//字型名稱 fontcolor: '#000',//字型顏色 image: null }; jq('#container').empty().qrcode(options); } jq(updateQrCode); </script> </html>