Android安卓4.0以下,fastclick触发两次?

前几天写了个防穿透的模态框。 Modal模态框的防穿透问题,模态框弹出后,禁止body滑动事件

但是今天上线前测试,用Android4.0以下的手机测试时,点击模态框的时候还是出现了穿透,好比 b 是模态框上的按钮,a 是下层页面的按钮。当点击 b 的时候, a 被触发了。同事说这种问题不用改了,可能觉得身边使用的人少了,没那个必要了,我还是在网上搜了下解决办法,找到了,虽然说很粗暴,但我测了下,的确解决了。很好~~~

是这样的,我在插件中加了

<div class="preventClick"></div>

也就是 弹窗出现的时候,这个弹层也出现,是下面这种结构
这里写图片描述

.preventClick { 
    width:100%; 
    height:100%; 
    position:absolute; 
    z-index:1000;
    top:0; 
    left:0;
    display:none;
}

在生成弹窗前,让 preventClick 显示出来。

function onDeviceReady() { // 安卓4.2下fastclick触发两次
    setTimeout(function(){ $('.preventClick').hide(); }, 300);
}
$('.preventClick').show();  // 安卓4.0防穿透遮罩层

PopHelper.pop({
    title : "温馨提示",
    content : str,
    confirmBtn : "知道了",
    callbacks : [ function() {
            hideLoading();
            var data = $(e.target).data("str");
            order(data);
        },function(){
            hideLoading();
            onDeviceReady(); // 300ms后隐藏遮罩层
            $(".rf-dialog").remove(); //在插件函数里,其实是有这句的,但是IOS10.3.2却有问题,所以在这里再添加上
    } ]
});

经过测试,没有穿透点击了,实现了。

学习于 《 Fastclick 导致click事件触发两次的问题

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值