如何让手机网站上二维码能够长按识别

方法/步骤

  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. 使用以下的代码生成二维码。注意:这个时候生成的二维码在微信中长安没任何反应,因为qrcode生成的是canvas标签而不是img标签。
     

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

  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

完成上述步骤后就可以在自己建网站时实现二维码长按识别了。

猜你喜欢

转载自blog.csdn.net/caimaomaocai/article/details/81628159