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使用ajax_动力节点Java学院整理
Jul 05 jQuery
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
jQuery实现的两种简单弹窗效果示例
Apr 18 jQuery
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
Aug 28 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
jQuery访问json文件中数据的方法示例
Jan 28 jQuery
JQuery事件委托原理与用法实例分析
May 13 jQuery
jquery+php后台实现省市区联动功能示例
May 23 jQuery
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
Jun 04 jQuery
jQuery zTree如何改变指定节点文本样式
Oct 16 jQuery
jQuery实现可以扩展的日历
Dec 01 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数组排序之sort、asort与ksort用法实例
2014/09/08 PHP
smarty简单分页的实现方法
2014/10/27 PHP
ThinkPHP模版中导入CSS和JS文件的方法
2014/11/29 PHP
Yii配置与使用memcached缓存的方法
2016/07/13 PHP
php 查找数组元素提高效率的方法详解
2017/05/05 PHP
PHP实现模拟http请求的方法分析
2017/12/20 PHP
php的instanceof和判断闭包Closure操作示例
2020/01/26 PHP
使用jQuery清空file文件域的解决方案
2013/04/12 Javascript
JavaScript实现带箭头标识的多级下拉菜单效果
2015/08/27 Javascript
判断JS对象是否拥有某属性的方法推荐
2016/05/12 Javascript
jQuery的ajax下载blob文件
2016/07/21 Javascript
jQuery实现字符串全部替换的方法
2016/12/12 Javascript
Jquery Easyui对话框组件Dialog使用详解(14)
2016/12/19 Javascript
javascript图片预览和上传(兼容IE)
2017/03/15 Javascript
浅谈原生JS中的延迟脚本和异步脚本
2017/07/12 Javascript
AngularJS实现controller控制器间共享数据的方法示例
2017/10/30 Javascript
vue-cli 项目打包完成后运行文件路径报错问题
2019/07/19 Javascript
微信小程序组件传值图示过程详解
2019/07/31 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
2019/11/09 Javascript
[04:14]从西雅图到上海——玩家自制DOTA2主题歌曲应援TI9
2019/07/11 DOTA
python fabric使用笔记
2015/05/09 Python
python显示生日是星期几的方法
2015/05/27 Python
Python装饰器实现几类验证功能做法实例
2017/05/18 Python
详解安装mitmproxy以及遇到的坑和简单用法
2019/01/21 Python
python实现银联支付和支付宝支付接入
2019/05/07 Python
Django ORM 常用字段与不常用字段汇总
2019/08/09 Python
Pycharm最新激活码2019(推荐)
2019/12/31 Python
python+selenium+chrome批量文件下载并自动创建文件夹实例
2020/04/27 Python
python实现猜数游戏(保存游戏记录)
2020/06/22 Python
python制作抽奖程序代码详解
2021/01/15 Python
HTML5实现预览本地图片
2016/02/17 HTML / CSS
工作的心得体会
2013/12/31 职场文书
森林防火工作方案
2014/02/14 职场文书
2015社区精神文明建设工作总结
2015/04/21 职场文书
反腐倡廉主题教育活动总结
2015/05/07 职场文书
redis击穿 雪崩 穿透超详细解决方案梳理
2022/03/17 Redis