网站学堂 - 轻松学习从此开始!

网站学堂

当前位置: 主页 > PHP >

jquery实现微信长按识别二维码

时间:2016-08-25 19:47来源:未知 作者:fang 点击:
摘要 微信开发,解决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
摘要
微信开发,解决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

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


(责任编辑:fang)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
栏目列表
推荐内容