?第一步：

引入：<script src="qrcode.js"></script>

第二步：

<div id="qrcode"></div>

第三步：

// 1.簡單使用方式 ：new QRCode(document.getElementById('qrcode'), 'http://www.baidu.com');

// 2.設置參數使用方式：?var qrcode = new QRCode('qrcode',? ? ?//document.getElementById('#qrcode');

{ text: 'http://www.baidu.com',

width: 256, height: 256,

colorDark : '#000000',

colorLight : '#ffffff',

correctLevel : QRCode.CorrectLevel.H

});

?

// 3使用 API

qrcode.clear();

qrcode.makeCode('new content');

總結:參數說明：

new QRCode(element, option)

element-顯示二維碼的元素或該元素的 ID

option參數配置

width256圖像寬度height256圖像高度typeNumber4colorDark"#000000"前景色colorLight"#ffffff"背景色

correctLevelQRCode.CorrectLevel.L容錯級別，可設置為：

QRCode.CorrectLevel.L

QRCode.CorrectLevel.M

QRCode.CorrectLevel.Q

QRCode.CorrectLevel.H

API 接口

名稱說明

makeCode(text)	設置二維碼內容
clear()	清除二維碼。（僅在不支持 Canvas 的瀏覽器下有效）

?

轉載于:https://www.cnblogs.com/tangchangcai/p/7826617.html

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的如何在前端生成二维码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。