微信网页中 长按识别二维码时 如果同一页面中有多个二维码 会随机识别一个二维码的情况..这种状况是不能忍受的..
在度娘上面搜索一些相关信息,有人说 微信识别二维码的机制是 先整张页面截图,在分析图中的二维码(原谅我不记得出处了)..既然可能是这种机制,那应对起来也就方便一些了
先说一下思路:
###假如页面中有两张二维码,当点按 A 二维码时,将 B 二维码加一个遮罩层,这样在微信截图到的页面中,只有 A 是一个很明显的二维码..识别出 A 二维码的几率就会高上很多
具体代码如下
$('li').on('touchstart',function(){
$(this).siblings('li').find('.mask_img').css({'display':'block'});
});
$('li').on('touchend',function(){
$(this).siblings('li').find('.mask_img').css({'display':'none'});
});
<li class="left fl" style="position:relative;">
<img src="4_07.png" class="jointly_one" alt="img">
<div class="mask_img"></div>
<img src="123_logo.png" class="jointly_two" alt="img">
</li>
<li class="right fl" style="position:relative;">
<img src="4_09.png" class="jointly_one" alt="img">
<div class="mask_img"></div>
<img src="logo.png" class="jointly_two" alt="img">
</li>
.mask_img{ background: rgba(0,0,0,0.9);width:6.4rem; height:6.4rem; position: absolute; top:0; left:0; display: none;}