QRCode.js:使用 JavaScript 生成二维码
JavaScriptJS 生成 二维码 Qrcode 使用
2023-09-14 09:01:11 时间
什么是 QRCode.js?
QRCode.js 是一个用于生成二维码的 JavaScript 库。主要是通过获取 DOM 的标签,再通过 HTML5 Canvas 绘制而成,不依赖任何库。
基本用法
<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "http://www.runoob.com"); // 设置要生成二维码的链接
</script>
或者使用一些可选参数设置:
var qrcode = new QRCode("test", {
text: "http://www.runoob.com",
width: 128,
height: 128,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
同样我们可以使用以下方法:
qrcode.clear(); // 清除代码
qrcode.makeCode("http://www.w3cschool.cc"); // 生成另外一个二维码
浏览器支持
支持该库的浏览器有:IE6~10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile, 等。
实例代码
HTML 代码
<input id="text" type="text" value="http://www.runoob.com" /><br />
<div id="qrcode"></div>
CSS 代码
#qrcode {
width:160px;
height:160px;
margin-top:15px;
}
JavaScript 代码
var qrcode = new QRCode("qrcode");
function makeCode () {
var elText = document.getElementById("text");
if (!elText.value) {
alert("Input a text");
elText.focus();
return;
}
qrcode.makeCode(elText.value);
}
makeCode();
$("#text").
on("blur", function () {
makeCode();
}).
on("keydown", function (e) {
if (e.keyCode == 13) {
makeCode();
}
});
资源下载
Qrcode 库及实例下载:qrcodejs-04f46c6.zip
Github 地址:https://github.com/davidshimjs/qrcodejs
相关文章
- JS转换HTML转义符,防止javascript注入攻击,亲测可用「建议收藏」
- [javascript] js如何获取浏览器的语言
- Js生成二维码_js在线生成二维码
- 干货 | 一文搞懂在AlmaLinux上安装Angular JavaScript框架
- JS引擎(1):JS引擎擂台赛,JavaScript引擎的特征比较及术语科普
- 给 Javascript 加上面向对象的属性:Class.js
- 创建JS文件:在Linux下实现自动化任务(linux创建js文件)
- Linux上的JS压缩工具(js压缩工具linux)
- JavaScript实现MySQL数据库查询(js查询mysql数据库)
- 实现JavaScript登录oracle的步骤(js登录连接oracle)
- JS将文件传输至MySQL数据库(.js传文件至mysql)
- javascript实现动态增加删除表格行(兼容IE/FF)
- javascript下用键盘控制层的移动的代码
- JavaScript入门学习书籍推荐
- Javascript入门学习第二篇js类型
- Node.js:Windows7下搭建的Node.js服务(来玩玩服务器端的javascript吧,这可不是前端js插件)
- 多种方法判断Javascript对象是否存在
- javascript从右边截取指定字符串的三种实现方法
- Javascript加载速度慢的解决方案
- JavaScript实现列出数组中最长的连续数
- javascript数组与php数组的地址传递及值传递用法实例