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实现多张图片上传预览(不经过后端处理)
Apr 29 jQuery
jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解
Jun 12 jQuery
jquery对table做排序操作的实例演示
Aug 10 jQuery
jQuery Position方法使用和兼容性
Aug 23 jQuery
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 jQuery
jQuery+datatables插件实现ajax加载数据与增删改查功能示例
Apr 17 jQuery
jQuery实现的电子时钟效果完整示例
Apr 28 jQuery
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
jQuery使用each遍历循环的方法
Sep 19 jQuery
在vue项目中使用Jquery-contextmenu插件的步骤讲解
Jan 27 jQuery
jQuery 动画与停止动画效果实例详解
May 19 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
超外差式晶体管收音机的组装与统调
2021/03/01 无线电
PHP读取CURL模拟登录时生成Cookie文件的方法
2014/11/04 PHP
PHP抓取远程图片(含不带后缀的)教程详解
2016/10/21 PHP
PHP调用全国天气预报数据接口查询天气示例
2019/02/20 PHP
过虑特殊字符输入的js代码
2010/08/05 Javascript
jquery判断浏览器类型的代码
2012/11/05 Javascript
js复制网页内容并兼容各主流浏览器的代码
2013/12/17 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
探究JavaScript函数式编程的乐趣
2015/12/14 Javascript
JS控制页面跳转时未请求要跳转的地址怎么回事
2016/10/14 Javascript
Vue.js表单控件实践
2016/10/27 Javascript
JavaScript编写九九乘法表(两种任选)
2017/02/04 Javascript
vue.js中npm安装教程图解
2018/04/10 Javascript
对vue 键盘回车事件的实例讲解
2018/08/25 Javascript
利用Django框架中select_related和prefetch_related函数对数据库查询优化
2015/04/01 Python
Python操作MongoDB数据库PyMongo库使用方法
2015/04/27 Python
Python 实现 贪吃蛇大作战 代码分享
2016/09/07 Python
python导入时小括号大作用
2017/01/10 Python
Python实现简单的文本相似度分析操作详解
2018/06/16 Python
selenium+python自动化测试之环境搭建
2019/01/23 Python
Django如何开发简单的查询接口详解
2019/05/17 Python
Python Pandas 如何shuffle(打乱)数据
2019/07/30 Python
TensorFLow 不同大小图片的TFrecords存取实例
2020/01/20 Python
使用python实现CGI环境搭建过程解析
2020/04/28 Python
python向企业微信发送文字和图片消息的示例
2020/09/28 Python
python性能测试工具locust的使用
2020/12/28 Python
allbeauty美国:英国在线美容店
2019/03/11 全球购物
俄罗斯最大的灯具网站:Fandeco
2020/03/14 全球购物
亚马逊海外购:亚马逊美国、英国、日本、德国直邮
2021/03/18 全球购物
大学生个人总结的自我评价
2013/10/05 职场文书
高中同学聚会邀请函
2014/01/11 职场文书
初中生自我鉴定
2014/02/04 职场文书
2014教师党员个人自我评议
2014/09/20 职场文书
公司会议开幕词
2015/01/29 职场文书
学校隐患排查制度
2015/08/05 职场文书
python函数的两种嵌套方法使用
2022/04/02 Python