解决触摸屏设备click事件300ms的延迟的问题

时间:2022-09-30 00:19:36

  从点击屏幕上的元素到触发元素的 click 事件,移动浏览器(触摸屏)会有大约 300 毫秒的等待时间。为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作。300ms的等待时间,会让用户体验大大折损,fastclick.js库很好的解决了这个问题。

  使用FastClick的时候,在需要使用的层上,实例化它。我们使用document.body是因为希望所有的按钮和链接都获得快速点击。

使用方法:

window.addEventListener('load', function() {
FastClick.attach(document.body);
}, false);

  然后直接使用onclick事件,就不会有原先300ms延迟的问题了。

  另外,还有一种方法解决延迟问题,就是使用zepto.js库的tap事件,但是tap事件在特殊情况下会存在点透,所以在这里推荐使用fastclick.js库。