JavaScript实现的微信二维码图片生成器的示例


Posted in Javascript onOctober 26, 2016

jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码。

QRCode.js

QRCode.js是javascript实现二维码(QRCode)制作生成库。 QRCode.js有着良好的跨浏览器兼容性(高版本使用HTML5的 Canvas,低版本IE使用table元素绘制),而且QRCode.js没有任何依赖。只需要引用一个JS。

此插件是能够独立使用的,体积也比较小,使用gzip压缩后才不到4kb。因为它是直接在客户端生成的条码,所以不会有图片下载的过程,能够实现快速生成。它是基于一个多语言的类库封装的,也不依赖于其他额外的服务。

注* 它也支持使用SVG绘制二维码

基本使用

注* 首先需要添加对qrcode.js的引用,并创建一个空DIV

<div id="qrcode"></div> <script type="text/javascript"> new QRCode(document.getElementById("qrcode"), "http://jindo.dev.naver.com/collie"); </script>

还有更多参数可以选

var qrcode = new QRCode("test", {
 text: "http://jindo.dev.naver.com/collie",
 width: 128,
 height: 128,
 colorDark : "#000000",
 colorLight : "#ffffff",
 correctLevel : QRCode.CorrectLevel.H
});

你可以动态地改变二维码图片,速度很快

qrcode.clear();
qrcode.makeCode("http://naver.com");

浏览器支持

几乎支持所有浏览器: IE6~10, Chrome, Firefox, Safari, Opera, Mobile Safari, Android, Windows Mobile.

DEMO地址: http://davidshimjs.github.io/qrcodejs

注* 这里有一个Server端使用Node.JS生成二维码图片的库,有兴趣的同学也可以研究一下: https://github.com/soldair/node-qrcode

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

Javascript 相关文章推荐
jQuery操作CheckBox的方法介绍(选中,取消,取值)
Feb 04 Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
Mar 08 Javascript
jQuery动画效果animate和scrollTop结合使用实例
Apr 02 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
Nov 24 Javascript
jQuery实现判断控件是否显示的方法
Jan 11 Javascript
javaScript实现滚动条事件详解
Mar 24 Javascript
vue中关闭eslint的方法分析
Aug 04 Javascript
详解JavaScript 新语法之Class 的私有属性与私有方法
Apr 23 Javascript
javascript实现摄像头拍照预览
Sep 30 Javascript
koa2 数据api中间件设计模型的实现方法
Jul 13 Javascript
JavaScript代码简化技巧实例解析
Sep 09 Javascript
Vue实现tab导航栏并支持左右滑动功能
Jun 28 Vue.js
关于JavaScript中事件绑定的方法总结
Oct 26 #Javascript
WEB 前端开发中防治重复提交的实现方法
Oct 26 #Javascript
jquery+css3问卷答题卡翻页动画效果示例
Oct 26 #Javascript
简单的js计算器实现
Oct 26 #Javascript
利用python分析access日志的方法
Oct 26 #Javascript
浅谈jQuery绑定事件会叠加的解决方法和心得总结
Oct 26 #Javascript
关于Jquery中的事件绑定总结
Oct 26 #Javascript
You might like
php下实现农历日历的代码
2007/03/07 PHP
php使用simplexml_load_file加载XML文件并显示XML的方法
2015/03/19 PHP
yii添删改查实例
2015/11/16 PHP
PHP二分查找算法示例【递归与非递归方法】
2016/09/29 PHP
基于PHP实现的多元线性回归模拟曲线算法
2018/01/30 PHP
PHP实现动态获取函数参数的方法示例
2018/04/02 PHP
js压缩利器
2007/02/20 Javascript
javascript parseInt与Number函数的区别
2010/01/21 Javascript
扒一扒JavaScript 预解释
2015/01/28 Javascript
iframe中子父类窗口调用JS的方法及注意事项
2015/08/25 Javascript
javascript字符串替换函数如何一次性全部替换掉
2015/10/30 Javascript
JavaScript继承模式粗探
2016/01/12 Javascript
jQuery通过deferred对象管理ajax异步
2016/05/20 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
浅谈使用splice函数对数组中的元素进行删除时的注意事项
2016/12/04 Javascript
微信小程序 登录实例详解
2017/01/16 Javascript
jQuery实现元素的插入
2017/02/27 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
2017/07/24 Javascript
Mint UI 基于 Vue.js 移动端组件库
2017/11/07 Javascript
p5.js临摹动态图形的方法
2019/10/23 Javascript
vue-router的hooks用法详解
2020/06/08 Javascript
javascript实现左右缓动动画函数
2020/11/25 Javascript
让 python 命令行也可以自动补全
2014/11/30 Python
python3实现UDP协议的服务器和客户端
2017/06/14 Python
Python 模拟登陆的两种实现方法
2017/08/10 Python
Python求解任意闭区间的所有素数
2018/06/10 Python
基于Django框架利用Ajax实现点赞功能实例代码
2018/08/19 Python
python将一个英文语句以单词为单位逆序排放的方法
2018/12/20 Python
用Python读取几十万行文本数据
2018/12/24 Python
python Selenium实现付费音乐批量下载的实现方法
2019/01/24 Python
django模型动态修改参数,增加 filter 字段的方式
2020/03/16 Python
HTML5网页音乐播放器的示例代码
2017/11/09 HTML / CSS
linux面试题参考答案(2)
2015/12/06 面试题
杠杆的科学教学反思
2014/01/10 职场文书
民事赔偿协议书
2014/11/02 职场文书
有关水浒传的读书笔记
2015/06/25 职场文书