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 相关文章推荐
JSON 入门指南 想了解json的朋友可以看下
Aug 26 Javascript
DOM基础教程之模型中的模型节点
Jan 19 Javascript
纯javascript制作日历控件
Jul 17 Javascript
JS button按钮实现submit按钮提交效果
Nov 01 Javascript
浅谈layer的iframe弹窗给里面的标签赋值的问题
Nov 10 Javascript
基于jQuery实现Tabs选项卡自定义插件
Nov 21 Javascript
JS简单实现数组去重的方法示例
Mar 27 Javascript
JS简单实现点击按钮或文字显示遮罩层的方法
Apr 27 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
May 16 Javascript
vue中如何去掉空格的方法实现
Nov 09 Javascript
JavaScript监听一个DOM元素大小变化
Apr 26 Javascript
Vue列表如何实现滚动到指定位置样式改变效果
May 09 Javascript
关于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实现的MySQL数据浏览器
2007/03/11 PHP
在服务端进行目录建立、删除,文件上传、删除的过程的php代码
2008/09/10 PHP
PHP JSON格式数据交互实例代码详解
2011/01/13 PHP
执行、获取远程代码返回:file_get_contents 超时处理的问题详解
2013/06/25 PHP
浅析51个PHP处理字符串的函数
2013/08/02 PHP
CodeIgniter生成静态页的方法
2016/05/17 PHP
php使用redis的几种常见操作方式和用法示例
2020/02/20 PHP
Open and Print a Word Document
2007/06/15 Javascript
JavaScript 异步调用框架 (Part 3 - 代码实现)
2009/08/04 Javascript
JavaScript仿商城实现图片广告轮播实例代码
2016/02/06 Javascript
jQuery文字提示与图片提示效果实现方法
2016/07/04 Javascript
DOM中事件处理概览与原理的全面解析
2016/08/16 Javascript
AngularJS 过滤器(自带和自建)详解
2016/09/19 Javascript
Vue自定义指令拖拽功能示例
2017/02/17 Javascript
微信小程序 页面跳转及数据传递详解
2017/03/14 Javascript
vue+axios实现登录拦截的实例代码
2017/05/22 Javascript
详解webpack 多页面/入口支持&amp;公共组件单独打包
2017/06/29 Javascript
解决vue.js在编写过程中出现空格不规范报错的问题
2017/09/20 Javascript
jQuery封装animate.css的实例
2018/01/04 jQuery
vue定义全局变量和全局方法的方法示例
2018/08/01 Javascript
简单讲解Python中的闭包
2015/08/11 Python
解决python使用open打开文件中文乱码的问题
2017/12/29 Python
Python 实现OpenCV格式和PIL.Image格式互转
2020/01/09 Python
可视化pytorch 模型中不同BN层的running mean曲线实例
2020/06/24 Python
Python 解析库json及jsonpath pickle的实现
2020/08/17 Python
巴西24小时在线药房:Drogasil
2020/06/20 全球购物
我想声明一个指针并为它分配一些空间, 但却不行。这些代码有什么 问题?char *p; *p = malloc(10);
2016/10/06 面试题
学生实习介绍信
2014/01/15 职场文书
2014年会策划方案
2014/05/11 职场文书
新农村建设标语
2014/06/24 职场文书
企业趣味活动方案
2014/08/21 职场文书
生产实习心得体会范文
2016/01/22 职场文书
创业计划书之蛋糕店
2019/08/29 职场文书
2021-4-5课程——SQL Server查询【3】
2021/04/05 SQL Server
使用RedisTemplat实现简单的分布式锁
2021/11/20 Redis
Python if else条件语句形式详解
2022/03/24 Python