移动端click延迟和tap事件

匿名 (未验证) 提交于 2019-12-02 21:53:52

一、click等事件在移动端的延迟

click事件在移动端和pc端均可以触发,但是在移动端有延迟现象。

1、背景

由于早期移动设备浏览网页时内容较小,为了增强用户体验,苹果公司专门为移动设备设计了双击放大的功能,以确保用户可以方便地放大网页内容,但是当用户单击按钮的时候,移动设备需要延迟Լ300ms执行,以判断用户是否是要双击。

2、验证

下面通过js代码来直观地验证click等事件的延迟

<div class="result">点我试试</div>

 

移动端 时间响应原则:优先响应移动端独有事件。

二、解决办法

1、使用touch事件模拟click事件

如下使用touchstart和touched封装了一个移动端的tap事件

 

可以直接调用idcast中tap方法。

2、使用zepto中已经封装好的tap事件直接调用

$(menuBox).on("tap",callback)

zepto下载链接:https://github.com/madrobby/zepto

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!