如何在頁面中根據輸入的內容自動生成二維碼

 可使用QRCode.js ,是一個用於生成二維碼圖片的插件。javascript

    在線演示html

使用方法

載入 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 }); // 使用 API qrcode.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.Ljava

QRCode.CorrectLevel.M瀏覽器

QRCode.CorrectLevel.Qui

QRCode.CorrectLevel.Hspa

API 接口

名稱 說明
makeCode(text) 設置二維碼內容
clear() 清除二維碼。(僅在不支持 Canvas 的瀏覽器下有效)
相關文章
相關標籤/搜索