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 tip提示插件(实例分享)
Apr 28 jQuery
使用jQuery.Pin垂直滚动时固定导航
May 24 jQuery
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
jquery实现左右轮播切换效果
Jan 01 jQuery
jQuery实现购物车的总价计算和总价传值功能
Nov 28 jQuery
jQuery实现的别踩白块小游戏完整示例
Jan 07 jQuery
jquery的$().each和$.each的区别
Jan 18 jQuery
jQuery实现的导航条点击后高亮显示功能示例
Mar 04 jQuery
使vue实现jQuery调用的两种方法
May 12 jQuery
JQuery实现简单的复选框树形结构图示例【附源码下载】
Jul 16 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
ajax jquery实现页面某一个div的刷新效果
Mar 04 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
全国FM电台频率大全 - 7 吉林省
2020/03/11 无线电
PHP中mysql_field_type()函数用法
2014/11/24 PHP
Docker搭建自己的PHP开发环境
2018/02/24 PHP
PHP命名空间与自动加载机制的基础介绍
2019/08/25 PHP
yii2.0框架使用 beforeAction 防非法登陆的方法分析
2019/09/11 PHP
PHP实现单例模式建立数据库连接的方法分析
2020/02/11 PHP
IE中jscript/javascript的条件编译
2006/09/07 Javascript
不用MOUSEMOVE也能滑动啊
2007/05/23 Javascript
jQuery学习笔记 操作jQuery对象 文档处理
2012/09/19 Javascript
Jquery post传递数组方法实现思路及代码
2013/04/28 Javascript
ExtJS 刷新后如何默认选中刷新前最后一次选中的节点
2014/04/03 Javascript
js实现ifram取父窗口URL地址的方法
2015/02/09 Javascript
JS动画效果打开、关闭层的实现方法
2015/05/09 Javascript
详解Angular的双向数据绑定(MV-VM)
2016/12/26 Javascript
详解jQuery中ajax.load()方法
2017/01/25 Javascript
javascript实现Emrips反质数枚举的示例代码
2017/12/06 Javascript
微信小程序实现长按删除图片的示例
2018/05/18 Javascript
[03:09]显微镜下的DOTA2第一期——带你走进华丽的DOTA2世界
2014/06/20 DOTA
python基于queue和threading实现多线程下载实例
2014/10/08 Python
Python数据结构与算法之图的广度优先与深度优先搜索算法示例
2017/12/14 Python
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
完美解决安装完tensorflow后pip无法使用的问题
2018/06/11 Python
使用python3调用wxpy模块监控linux日志并定时发送消息给群组或好友
2019/06/05 Python
pandas读取CSV文件时查看修改各列的数据类型格式
2019/07/07 Python
python Gunicorn服务器使用方法详解
2019/07/22 Python
详解python中index()、find()方法
2019/08/29 Python
python 实现图片修复(可用于去水印)
2020/11/19 Python
HTML5+css3:3D旋转木马效果相册
2017/01/03 HTML / CSS
NEW LOOK官网:英国时装零售巨头之一,快时尚品牌
2017/01/11 全球购物
应届优秀本科大学毕业生自我鉴定
2014/01/21 职场文书
小学生操行评语
2014/04/22 职场文书
兴趣小组活动总结
2014/05/05 职场文书
班风学风建设方案
2014/05/06 职场文书
法制宣传标语集锦
2014/06/25 职场文书
网球场地租赁协议范本
2014/10/07 职场文书
简易离婚协议书范本
2014/10/24 职场文书