QRCode.js 是一個用於生成二維碼圖片的插件。
在線實例
實例預覽 基礎示例
實例預覽 API 接口
使用方法
載入 JavaScript 文件
- <script src="qrcode.js"></script>
復制
DOM 結構
- <div id="qrcode"></div>
復制
調用
// 簡單方式new QRCode(document.getElementById('qrcode'), 'your content');// 設置參數方式var qrcode = new QRCode('qrcode', {text: 'your content',width: 256,height: 256,colorDark : '#000000',colorLight : '#ffffff',correctLevel : QRCode.CorrectLevel.H});// 使用 APIqrcode.clear();qrcode.makeCode('new content');
復制
參數說明
- new QRCode(element, option)
復制
| 名稱 | 默認值 | 說明 |
|---|---|---|
| element | - | 顯示二維碼的元素或該元素的 ID |
| option | 參數配置 |
option 參數說明
| 名稱 | 默認值 | 說明 |
|---|---|---|
| width | 256 | 圖像寬度 |
| height | 256 | 圖像高度 |
| typeNumber | 4 | |
| colorDark | "#000000" | 前景色 |
| colorLight | "#ffffff" | 背景色 |
| correctLevel | QRCode.CorrectLevel.L | 容錯級別,可設置為: QRCode.CorrectLevel.L QRCode.CorrectLevel.M QRCode.CorrectLevel.Q QRCode.CorrectLevel.H |
API 接口
| 名稱 | 說明 |
|---|---|
| makeCode(text) | 設置二維碼內容 |
| clear() | 清除二維碼。(僅在不支持 Canvas 的瀏覽器下有效) |
