zoukankan      html  css  js  c++  java
  • 移动端触屏click点击事件延迟问题,以及tap的解决方案

    在移动端 触屏click事件虽然也会响应,但是总感觉是有延迟,一直听说click事件在手机上有200~300毫秒的延迟问题,亲自测了一下,在pc端模拟手机的话是测不出来的,但是用手机测试时发现延迟非常明显,用我的iphone5执行下段测试代码,平均延迟在370毫秒!结果非常惊人,所以在移动端必须得用tap事件了,click不仅仅是慢的问题,而且会严重影响css3动画!没错,这绝对是真的,我做的单页应用,用click事件执行的,点击后css3切换动画,经常会出现动画被省略掉直接到最后一个keyframe,之前一直怀疑是click有问题,在我用自己封装的tap事件替代click之后,css3动画立即变得无比的流畅,再没出现过掉帧现象。

    补充:android手机上click事件没有延迟现象,能够立即触发 

    tap事件原生是没有的,如果不想封装的话可以用touchend事件代替,当然这样做的话滑动的时候也会可能触发得到,最好还是封装一下,或用iscroll,zepto之类的库,我的另一篇文章也有一个完整的封装tap和swipe手势的组件代码。

    传送门:通过html5 touch事件封装手势识别组件

    测试代码(注:使用iphone手机来测试ios7~ios9,在android下我的测试机型没遇到这个问题)

    var start,end;
     
    $(document.body).append($("<a href='javascript:' id='btn_test'>test</a>")); $(
    "#btn_test").bind("touchend",function(){ start=new Date(); }) $("#btn_test").bind("click",function(){ end=new Date(); alert(end-start); })
  • 相关阅读:
    【WF2017】Mission Improbable
    【Codeforces 837D】Round Subset
    【Codeforces 788C】The Great Mixing
    【JSOI2008】最大数
    2.1图像的数字化
    MATLAB生成随机数
    四六级准考证号忘记了如何快速查询四六级成绩?
    加密与水印结合
    如何在 PyPI安装python的软件包?
    matlab中如何定义函数
  • 原文地址:https://www.cnblogs.com/windyfancy/p/5174276.html
Copyright © 2011-2022 走看看