美文网首页
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事件

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

  • 前端面经

    1.js的onclick事件和jQuery的click事件有何区别? 1.onclick是绑定的事件(它是一个事件...

  • jQery----click事件

    onclick:javascript事件 onclick 事件会在对象被点击时发生。 Click 事件: 此事...

  • 2020-03-17

    input按钮中的onclick事件 input按钮onclick事件大全

  • 绑定事件

    1、在节点中绑定tap事件 其中,tap为事件的类型, onTap为事件回调函数的名称;"bind:tap"也可写...

  • DOM事件模型

    onclick和addEventListener 关于onclick 不能同时添加多个onclick事件,后面添加...

  • 007-手势事件

    手势事件 ios 手势事件主要有 Tap事件 Tap 事件就是简单的点击事件。 首先放上一个 UIView 用于点...

  • 微信小程序学习记录

    1. bindtap和catchtap(1.5.0后 bind:tap 、 catch:tap ) bind事件...

  • 关于点击事件onclick 和 addEventListener

    关于点击事件onclick 和 addEventListener的思考 基本写法 onclick 和 addEve...

  • 小程序开发知识点总结

    一、事件 1.1 点击事件:tap 长按事件: longtap 触摸事件:touchstart touchend ...

网友评论

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

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