QRCode.js:基于JQuery的生成二维码JS库的使用


Posted in jQuery onJune 23, 2017

1. QRCode.js

QRCode.js是一个二维码生成javascript库;支持跨浏览器的HTML5 Canvas和表格标签的DOM操作;并且不依赖其它的库或拓展。

主页:QRCode.js

Github:davidshimjs/qrcodejs 

2. 用法

2.1 基础用法

<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "https://www.gzpblog.com");
</script>

2.2 传参用法

<div id="qrcode"></div>
<script type="text/javascript">
var qrcode = new QRCode(document.getElementById("qrcode"), {
  text: "https://www.gzpblog.com",
  width: 128,
  height: 128,
  colorDark : "#000000",
  colorLight : "#ffffff",
  correctLevel : QRCode.CorrectLevel.H
});
</script>

2.3 调用函数

qrcode.clear(); // 清除二维码
qrcode.makeCode("https://www.gzpblog.com"); // 创建一个新的二维码

3. 适用范围

之前用PHP QR Code来生成二维码,发现通过这个PHP插件来生成,有些小问题;它内部集成得不是很好,不是很适合用来直接展示二维码到浏览器上,样式不好控制(不保存二维码文件的情况下)。

而使用QRCode.js可以非常方面地控制样式,就像一张图片一样来用,因为图片直接输出到

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

中,非常可控。就像之前微信支付官方的sdk,phpsdk是用的phpqrcode来生成,改成QRCode.js,之后,一个简单的效果:

QRCode.js:基于JQuery的生成二维码JS库的使用

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery中map函数的两种方式
Apr 07 jQuery
jQuery+pjax简单示例汇总
Apr 21 jQuery
jQuery制作input提示内容(兼容IE8以上)
Jul 05 jQuery
jQuery 实现图片的依次加载图片功能
Jul 06 jQuery
使用jQuery实现页面定时弹出广告效果
Aug 24 jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
jQuery实现页码跳转式动态数据分页
Dec 31 jQuery
jQuery动态添加元素无法触发绑定事件的解决方法分析
Jan 02 jQuery
vue-cli webpack 引入jquery的方法
Jan 10 jQuery
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 jQuery
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
详谈表单格式化插件jquery.serializeJSON
Jun 23 #jQuery
简单谈谈require模块化jquery和angular的问题
Jun 23 #jQuery
文本溢出插件jquery.dotdotdot.js使用方法详解
Jun 22 #jQuery
jQuery实现可拖动进度条实例代码
Jun 21 #jQuery
基于jquery日历价格、库存等设置插件
Jul 05 #jQuery
jquery.validate表单验证插件使用详解
Jun 21 #jQuery
jquery基于layui实现二级联动下拉选择(省份城市选择)
Jun 20 #jQuery
You might like
PHP中Session引起的脚本阻塞问题解决办法
2014/04/08 PHP
用PHP代码给图片加水印
2015/07/01 PHP
js类中获取外部函数名的方法
2007/08/19 Javascript
ajax 文件上传应用简单实现
2009/03/03 Javascript
AppBaseJs 类库 网上常用的javascript函数及其他js类库写的
2010/03/04 Javascript
javascript时区函数介绍
2012/09/14 Javascript
jQuery中json对象的复制方式介绍(数组及对象)
2013/06/08 Javascript
js控制表单操作的常用代码小结
2013/08/15 Javascript
Mac/Windows下如何安装Node.js
2013/11/22 Javascript
分享javascript计算时间差的示例代码
2020/03/19 Javascript
js入门之Function函数的使用方法【新手必看】
2016/11/22 Javascript
BootStrop前端框架入门教程详解
2016/12/25 Javascript
Javascript中的 “&amp;” 和 “|” 详解
2017/02/02 Javascript
微信小程序网络请求wx.request详解及实例
2017/05/18 Javascript
ES6解构赋值的功能与用途实例分析
2017/10/31 Javascript
Vue源码解读之Component组件注册的实现
2018/08/24 Javascript
关于RxJS Subject的学习笔记
2018/12/05 Javascript
python3利用smtplib通过qq邮箱发送邮件方法示例
2017/12/03 Python
python numpy数组的索引和切片的操作方法
2018/10/20 Python
Python中实现单例模式的n种方式和原理
2018/11/14 Python
Python实现正则表达式匹配任意的邮箱方法
2018/12/20 Python
Python开发之Nginx+uWSGI+virtualenv多项目部署教程
2019/05/13 Python
为什么你还不懂得怎么使用Python协程
2019/05/13 Python
pycharm无法安装第三方库的问题及解决方法以scrapy为例(图解)
2020/05/09 Python
奥地利购买珠宝和手表网站:ELLA JUWELEN
2019/09/03 全球购物
建筑行业的大学生自我评价
2013/12/08 职场文书
土木工程专业推荐信
2014/02/19 职场文书
2014小学植树节活动总结
2014/03/10 职场文书
《海底世界》教学反思
2014/04/16 职场文书
机关党员三严三实心得体会
2014/10/13 职场文书
查摆问题整改措施
2014/10/24 职场文书
金秋助学感谢信
2015/01/21 职场文书
四则混合运算教学反思
2016/02/23 职场文书
家电创业计划书
2019/08/05 职场文书
导游词之淮安明祖陵
2019/11/25 职场文书
postgres之jsonb属性的使用操作
2021/06/23 PostgreSQL