可使用QRCode.js ,是一個用於生成二維碼圖片的插件。javascript
在線演示html
<script src="qrcode.js"></script>
<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 }); // 使用 API qrcode.clear(); qrcode.makeCode('new content');
new QRCode(element, option)
名稱 | 默認值 | 說明 |
---|---|---|
element | - | 顯示二維碼的元素或該元素的 ID |
option | 參數配置 |
名稱 | 默認值 | 說明 |
---|---|---|
width | 256 | 圖像寬度 |
height | 256 | 圖像高度 |
typeNumber | 4 | |
colorDark | "#000000" | 前景色 |
colorLight | "#ffffff" | 背景色 |
correctLevel | QRCode.CorrectLevel.L | 容錯級別,可設置爲: QRCode.CorrectLevel.Ljava QRCode.CorrectLevel.M瀏覽器 QRCode.CorrectLevel.Qui QRCode.CorrectLevel.Hspa |
名稱 | 說明 |
---|---|
makeCode(text) | 設置二維碼內容 |
clear() | 清除二維碼。(僅在不支持 Canvas 的瀏覽器下有效) |