一、使用方法
1.1、引入 JS
HTML Code
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/qrcode-generator/1.4.1/qrcode.min.js"></script>
1.2、DOM 容器
HTML Code
<div id="qrcode"></div>
1.3、调用函数
JavaScript Code
var qr = qrcode(4, "H");
qr.addData("your content");
qr.make();
document.getElementById("qrcode").innerHTML = qr.createImgTag();
二、API接口说明
2.1、QRCode Factory
- QRCode qrcode(typeNumber,errorCorrectionLevel);
创建二维码对象。
参数 | 类型 | 说明 |
---|---|---|
typeNumber | Number | 二维码类型(1~40,输入 0 以自动检测) |
errorCorrectionLevel | String | 容错级别(L、M、Q、H) |
- number[] qrcode.stringToBytes(str);
将任意字符集的字符串编译成字节序列。这个函数是internal的,重写这个函数可在多字节字符集下编译字符串。
参数 | 类型 | 说明 |
---|---|---|
str | String | 待编译的字符串 |
2.2、QRCode
- void addData(data, mode);
添加二维码信息。
参数 | 类型 | 说明 |
---|---|---|
data | String | 二维码信息 |
mode | String | 信息编译模式,可设置为: Numeric 数字 Alphanumeric 文字数字混合 Byte 字节(默认) Kanji 日语汉字 |
- void make();
生成二维码对象(并不显示)。
- number getModuleCount();
获取二维码每行(orientation)的 cell 数 [注]。
- boolean isDark(row, col);
返回指定行列上的 cell 是否有信息(黑色)[注]。
参数 | 类型 | 说明 |
---|---|---|
row | Number | 行坐标(0~moduleCount-1) |
col | Number | 列坐标(0~moduleCount-1) |
- string createDataURL(cellSize, margin);
- string createImgTag(cellSize, margin, alt);
- string createSvgTag(cellSize, margin);
- string createTableTag(cellSize, margin);
- string createASCII(cellSize, margin);
相应的HTML Helper函数,主要用于显示二维码 [注]。
参数 | 类型 | 说明 |
---|---|---|
cellSize | Number | cell 像素宽度,默认为 2 |
margin | Number | 补白像素宽度,默认为 cellSize*4 |
alt | String | image 的提示 |
三、例程
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/qrcode-generator/1.4.1/qrcode.min.js"></script>
</head>
<body>
<div id="qrcode"></div>
<script type="text/javascript">
var width = 256;
var margin = 2;
var qr = qrcode(4, 'H');
qr.addData('BestHelp Consulting');
qr.make();
var moduleCount = qr.getModuleCount();
var cell = (width - margin * 2) / moduleCount;
document.getElementById('qrcode').innerHTML = qr.createImgTag(cell, margin);
</script>
</body>
</html>
四、参考链接
https://www.npmjs.com/package/qrcode-generator
[注] 须在调用 make() 后使用。