美文网首页
onclick事件和tap事件

onclick事件和tap事件

作者: 岩蔷薇 | 来源:发表于2017-04-15 13:28 被阅读0次

    1.onclick事件可在PC/移动端使用,但一般移动端不推荐使用onclick,因为onclick事件的执行速度比移动端事件慢200ms~300ms.

    2.移动端所有的事件都基于touch事件。

    tap事件系统本身不存在,需要通过touch自定义。

    tap事件:在touchstart与touchend之间,但不包括touchmove.

    自定义tap事件:(利用touch自定义封装)
    ① touchstart与touchend之间
    ② endTime - startTime <200ms
    ③ 不能包括touchmove事件。

    var tap = function(obj, callBack){
        if(typeof obj != 'object') return;
        // 变量
        var startTime = 0; // 记录触摸开始时间
        var isMove = false; // 记录是否产生移动
    
        obj.addEventListener('touchstart',function(){
            startTime = Date.now();
        });
    
        obj.addEventListener('touchmove',function(){
            isMove = true;
        });
    
        obj.addEventListener('touchend',function(e){
            if(Date.now() - startTime < 200 && !isMove){
                //触碰时间在200ms以内,不产生移动
                callBack && callBack(e);
            }
            // 清零
            startTime = 0;
            isMove = false;
        });
    };

    相关文章

      网友评论

          本文标题:onclick事件和tap事件

          本文链接:https://www.haomeiwen.com/subject/hsvnattx.html