博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Fastclick 导致click事件触发两次的问题,fastclickclick
阅读量:6237 次
发布时间:2019-06-22

本文共 763 字,大约阅读时间需要 2 分钟。

文章原文csdn链接:www.foreverpx.cn 

我在移动web上使用Fastclick这个库去解决300ms延迟问题,但是在安卓4.2下的webview中引发了另一个比较奇怪的bug。

在A页面中有个 a button,在B页面中有个 b button,a和b都在同一个position,给a和b都注册一个click事件。a的click事件触发后跳转到B页面。当a被点击后调到B页面,你会发现b按钮的click事件也被触发了。

没错,事件‘穿透’了两个页面!

但其实并没有穿透,点击a按钮时,其实有如下两个动作:

在ios等设备中,第二个click事件其实被fastclick屏蔽掉了,所以没出现这个问题,但是在android 4.2的浏览器中却bug搬的屏蔽失效,导致这个问题。

查了许多的相关资料,老外称这个现象为ghost click,大部分并没有什么有效的解决方案。

最后在stackoverflow中找到了一个hack方案,如下:

preventClick { width:100%; height:100%; position:absolute; z-index:1000; top:0; left:0; }
    
function onDeviceReady() {    setTimeout(function(){ $('#preventClick').hide(); }, 300); }

原理是每个页面前300ms都被一个透明的div去覆盖,所以第二个click是点不到对应的button。。

虽然这种方式比较暴力,但是还是奏效的,在没什么更好的方式前,可以先hack之。

转载于:https://www.cnblogs.com/xiaoshujiang/p/5558468.html

你可能感兴趣的文章
6.08 PMO的生存挑战-这些企业的痛你遇到了吗?
查看>>
傻瓜式十分钟免费开启 HTTPS,是时候为你的站点加上小绿锁了
查看>>
[洛谷P3550][POI2013]TAK-Taxis
查看>>
作业6--超级无敌终结(冲刺二)
查看>>
判断日期格式是否正确
查看>>
解决windows8 FlashPlayer丢失无法安装的问题
查看>>
Python 高级编程技巧
查看>>
BZOJ1497:[NOI2006]最大获利(最大权闭合子图)
查看>>
BZOJ2179:FFT快速傅立叶(FFT)
查看>>
BZOJ3123:[SDOI2013]森林(主席树,启发式合并)
查看>>
varchar和Nvarchar区别
查看>>
《MySQL入门很简单》练习9.5
查看>>
一个简单的购物车程序
查看>>
牛客小白月赛1 C-分元宵(快速幂)
查看>>
移动端样式小技巧
查看>>
嵌入式第九次
查看>>
201521123026 《JAVA程序设计》第12周学习总结
查看>>
heroku部署java web项目
查看>>
【转】Lesktop 1.0 ——开源JS控件库,WebIM和网盘
查看>>
java学习中,面向对象的三大特性:封装、继承、多态 以及 super关键字和方法的重写(java 学习中的小记录)...
查看>>