用纯JavaScript实现的微信二维码图片生成器
用纯JavaScript实现的微信二维码图片生成器
COLIN前端 发表于2年前
用纯JavaScript实现的微信二维码图片生成器
  • 发表于 2年前
  • 阅读 7082
  • 收藏 362
  • 点赞 23
  • 评论 20

新睿云服务器60天免费使用,快来体验!>>>   

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

注* 之前的二给码分享功能大多是由后端实现的,对服务器的负载较重,这里有一个前端实现的版本,而且性能还可以。

QRCode.js

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

注* 它也支持使用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

  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 8
博文 6
码字总数 8602
评论 (20)
meco
[79]
ucfox
:smile:
小薇
这也能推荐?
rugou
很早的东西了,老外的东西
混世顽童
有需要
翻
look
kinggochj
二维码。。。但不是图片!!!
ProgramCat
支持ie6?
纯24K爷们儿
http://www.xhuihui.cn/tool/qrcode.html
zqq90
标题 不应该带 “微信”
要吃九个橙子

引用来自“ProgramCat”的评论

支持ie6?
什么样的公司现在还要支持IE系列啊 。
Honghe

引用来自“webit”的评论

标题 不应该带 “微信”
是的。 同时生成的二维中间能否加图标 @colinfed?
风城剑客
这个NB坏了
啦啦啦拉拉

引用来自“小薇”的评论

这也能推荐?

微信等同二维码
我是李达康
有过类似的了 重复做轮子了
loyal
如果只是生成一个网址什么的到可以用...
如果是其他,那就算了吧.bug满天飞
931070318
good
asdtiang
早就用上了,这也发
南漂一卒

引用来自“Honghe”的评论

引用来自“webit”的评论

标题 不应该带 “微信”
是的。 同时生成的二维中间能否加图标 @colinfed?

有 canvas 就自己贴图,没有就用浮层模拟~
老张大哥
还是不错的,不是所有人都知道!人家只是记录自己的学习,你们这些人啊,你有本事自己写一个,也被推荐啊!
×
COLIN前端
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: