jquery实现微信中长按识别二维码
类别:Web前端 浏览量:761
时间:2017-3-5 jquery实现微信中长按识别二维码
jquery实现微信中长按识别二维码jquery.qrcode.js 是一个能够在客户端生成矩阵二维码QRCode 的jquery插件 ,使用它可以很方便的在页面上生成二维条码。
一、下载jquery.qrcode.js文件
下载地址:http://jeromeetienne.github.io/jquery-qrcode/
二、使用jquery.qrcode页面中生成二维码
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.qrcode.min.js"></script>
<li id="code"></li>
<script type="text/javascript" src="jquery.js"></
$("#code").qrcode({
render:"table", //设置渲染方式,qrcode支持canvas和table两种方式进行渲染,默认使用canvas方式
width:200, //设置宽度
height:200, //设置高度
background:"#ffffff",//背景颜色
foreground:"#000000",//前景颜色
typeNumber: -1, //计算模式
correctLevel: QRErrorCorrectLevel.H,//纠错等级
text:"http://www.studyofnet.com" //任意内容
});
</script>
三、实现微信中长按识别二维码
1、这个时候生成的二维码在微信中长安没任何反应,因为qrcode生成的是canvas标签而不是img标签
2、将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);
$('#imagQrli').append(img);//imagQrli表示你要插入的容器id
您可能感兴趣
- 链式编程jquery(实例详解jQuery的链式编程风格)
- jQuery中height()、innerheight()、outerheight()的区别
- jquery的动画效果api(jQuery框架实现元素显示及隐藏三种动画方式)
- jquery隐藏动画教程(jquery插件实现鼠标隐藏)
- html导航条下拉菜单代码(Html+Css+Jquery实现左侧滑动拉伸导航菜单栏的示例代码)
- jQuery toggleClass
- jqueryajax实现部分刷新(php+jQuery ajax实现的实时刷新显示数据功能示例)
- jquery弹出窗口过渡效果(jQuery实现大屏滚动播放效果)
- jquery deferred对象
- jquery on绑定多个事件
- jQuery里$(this)和this的区别有哪些
- jquery中prop和attr的区别
- jquery的直接设置下拉框的选中值(jquery实现户籍地选择下拉框)
- JQuery中serialize()
- jquery中filter
- jquery操作table
- 战 疫 时刻 致敬每一位石化大学的 守护者(战疫时刻)
- 老弄堂里的市井味道(老弄堂里的市井味道)
- 小米音乐可绑定QQ音乐, QQ音乐 真的会消失在小米的设备上吗(小米音乐可绑定QQ音乐)
- 小米Watch S1评测 或许能成为小米冲击高端可穿戴设备的里程碑(小米WatchS1评测或许能成为小米冲击高端可穿戴设备的里程碑)
- 手机QQ与小米路由器在一起 明天揭晓,敬请期待(手机QQ与小米路由器在一起)
- 小米音乐与 QQ 音乐合作,便捷迁移会员(小米音乐与QQ音乐合作)
热门推荐
- php怎么判断数据是质数(PHP判断一个变量是否为整数、正整数的方法示例)
- php怎样创建新文件详情(php文件后缀不强制为.php的实操方法)
- css如何设置表格样式
- node.js express 上线(node+express实现分页效果)
- docker-compose查看服务状态(Docker+DockerCompose封装web应用的方法步骤)
- boostrap弹幕效果(boostrap modal 闪现问题的解决方法)
- web前端css总结(前端面试必备之CSS3的新特性)
- docker无法访问宿主机ip(解决Mac下 docker 无法 ping 通宿主机的问题)
- python 装饰器模式(python重试装饰器的简单实现方法)
- sql数据分页如何查询(SQL分页查询方式汇总)