jQuery实现微信长按识别二维码功能


Posted in Javascript onAugust 26, 2016

最近一直在搞一个微信开发的项目,终于快要完工了,今天小编抽个时间记录下在项目开发过程中遇到jquery.qrcode.min.js生成二维码长按不识别的解决方法,希望对大家有所帮助!

1.引入JS库

<script src="jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script> 
<script src="jquery.qrcode.min.js" type="text/javascript" charset="utf-8"></script>

2.在页面创建一个空的div;

<div id="qrDiv"></div>

3.生成二维码

$("#qrDiv").qrcode({ 
width: 120, //宽度 
height:120, //高度 
text: "需要生成的二维码内容" //任意内容 
});

注意:这个时候生成的二维码在微信中长安没任何反应,因为qrcode生成的是canvas标签而不是img标签

4.将canvas标签转换为img标签

//从 canvas 提取图片 image 
function convertCanvasToImage(canvas) { 
//新Image对象,可以理解为DOM 
var image = new Image(); 
// canvas.toDataURL 返回的是一串Base64编码的URL,当然,浏览器自己肯定支持 
// 指定格式 PNG 
image.src = canvas.toDataURL("image/png"); 
return image; 
} 
//获取网页中的canvas对象 
var mycanvas1=document.getElementsByTagName('canvas')[0]; 
//将转换后的img标签插入到html中 
var img=convertCanvasToImage(mycanvas1); 
$('#imagQrDiv').append(img);//imagQrDiv表示你要插入的容器id

注意:完成上述步骤后就可以在微信中长按识别了

以上所述是小编给大家介绍的jQuery实现微信长按识别二维码功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery下onpropertychange事件的绑定方法
Aug 01 Javascript
使用jquery动态加载javascript以减少服务器压力
Oct 29 Javascript
jQuery.prototype.init选择器构造函数源码思路分析
Feb 05 Javascript
Javascript计算两个marker之间的距离(Google Map V3)
Apr 26 Javascript
jquery的ajax和getJson跨域获取json数据的实现方法
Feb 04 Javascript
js中自定义方法实现停留几秒sleep
Jul 11 Javascript
灵活的理解JavaScript中的this指向
Feb 25 Javascript
Javascript闭包与函数柯里化浅析
Jun 22 Javascript
Node.js调用fs.renameSync报错(Error: EXDEV, cross-device link not permitted)
Dec 27 Javascript
JavaScript累加、迭代、穷举、递归等常用算法实例小结
May 08 Javascript
JavaScript实现仿Clock ISO时钟
Jun 29 Javascript
jQuery实现动态添加和删除input框代码实例
Mar 29 jQuery
XMLHttpRequest Level 2 使用指南
Aug 26 #Javascript
js HTML5多图片上传及预览实例解析(不含前端的文件分割)
Aug 26 #Javascript
JavaScript组合模式学习要点
Aug 26 #Javascript
前端面试题及答案整理(二)
Aug 26 #Javascript
js前端面试题及答案整理(一)
Aug 26 #Javascript
JavaScript中ES6字符串扩展方法
Aug 26 #Javascript
总结十个Angular.js由浅入深的面试问题
Aug 26 #Javascript
You might like
第十四节--命名空间
2006/11/16 PHP
php学习之运算符相关概念
2011/06/09 PHP
PHP列出MySQL中所有数据库的方法
2015/03/12 PHP
js控制web打印(局部打印)方法整理
2013/05/29 Javascript
jquery右下角弹出提示框示例代码
2013/10/08 Javascript
js获取url中的参数且参数为中文时通过js解码
2014/03/19 Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
2014/06/20 Javascript
jQuery实现页面内锚点平滑跳转特效的方法总结
2015/05/11 Javascript
JavaScript截取指定长度字符串点击可以展开全部代码
2015/12/04 Javascript
解决node.js安装包失败的几种方法
2016/09/02 Javascript
JavaScript中的call和apply的用途以及区别
2017/01/11 Javascript
原生js实现手风琴功能(支持横纵向调用)
2017/01/13 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
微信小程序 flex实现导航实例详解
2017/04/26 Javascript
Vue单文件组件的如何使用方式介绍
2017/07/28 Javascript
JavaScript实现的仿新浪微博原生态输入字数即时检查功能【兼容IE6】
2017/09/26 Javascript
Angularjs按需查询实例代码
2017/10/30 Javascript
VueJs使用Amaze ui调整列表和内容页面
2017/11/30 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
2019/09/16 Javascript
js实现前端界面导航栏下拉列表
2020/08/27 Javascript
Python编写生成验证码的脚本的教程
2015/05/04 Python
利用Python破解验证码实例详解
2016/12/08 Python
python处理按钮消息的实例详解
2017/07/11 Python
pandas数据分组和聚合操作方法
2018/04/11 Python
Python闭包函数定义与用法分析
2018/07/20 Python
python遍历路径破解表单的示例
2020/11/21 Python
执行力心得体会
2013/12/31 职场文书
孕妇离婚协议书范本
2014/11/20 职场文书
优秀党员先进材料
2014/12/18 职场文书
优秀共青团员事迹材料
2014/12/25 职场文书
2015学校年度工作总结
2015/05/11 职场文书
导游词之秦始皇兵马俑博物馆
2019/09/29 职场文书
详解MySQL InnoDB存储引擎的内存管理
2021/04/08 MySQL
elementui的el-popover修改样式不生效的解决
2021/06/30 Javascript
Win11 S Mode版本泄露 正式上线后叫做Windows 11 SE
2021/11/21 数码科技
PostgreSQL常用字符串分割函数整理汇总
2022/07/07 PostgreSQL