/*封装tap*/
cc.tap = function(dom,callback){
/*
* 要求 没有触发 touchmove 事件
* 并且响应速度要比click快
*/
if(dom && typeof dom == 'object'){
var isMove = false;
var startTime = 0;
dom.addEventListener('touchstart',function(e){
//console.log('touchstart');
//console.time('tap');/*记录tap这个参数现在的时间*/
startTime = Date.now();
});
dom.addEventListener('touchmove',function(e){
//console.log('touchmove');
isMove = true;
});
dom.addEventListener('touchend',function(e){
//console.log('touchend');
//console.timeEnd('tap')/*打印tap这个参数距离上一次记录的时候的时间*/
/*判读 是否满足tap 的要求 一般要求tap的响应时间150*/
if(!isMove && (Date.now()-startTime) < 150){
/*调用 callback*/
callback && callback(e);
}
/*重置 参数*/
isMove = false;
startTime = 0;
});
}
}

这边进行封装的原因是click事件有一个延迟

移动端tap事件的封装的更多相关文章

  1. js移动端tap事件封装

    这几天做项目,发现移动端需要触摸事件,而click肯定是不行的,于是我对tap事件封装进行了搜索,找到了一篇文章,原文地址如下:http://www.jb51.net/article/50663.ht ...

  2. 移动端tap事件(轻击、轻触)

    一.问题 ①移动端也有click点击事件,click点击会延迟200~300ms ②因为点击的响应过慢,影响了用户体验,所以需要解决响应慢的问题 二.解决方案 ①使用tap事件:即轻击,轻敲,响应速度 ...

  3. 移动端tap事件,消除300毫秒延迟

    引用这个之前,要讲一下首先我是用了webpack技术,所以你的项目如果没有用到这个的话,最好不要用这个技术,当然想用也可以,改下代码也可以用. 下面的代码直接复制就可以用啦. ( function(e ...

  4. 移动端WEB开发,click,touch,tap事件浅析

    一.click 和 tap 比较 两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件. singleTap和doubleTap 分 ...

  5. 移动端为何不使用click而模拟tap事件及解决方案

    移动端click会遇到2个问题,click会有200-300ms的延迟,同时click事件的延迟响应,会出现穿透,即点击会触发非当前层的点击事件. 为什么会存在延迟? Google开发者文档中有提到: ...

  6. 移动端click延迟和tap事件

    一.click等事件在移动端的延迟 click事件在移动端和pc端均可以触发,但是在移动端有延迟现象. 1.背景 由于早期移动设备浏览网页时内容较小,为了增强用户体验,苹果公司专门为移动设备设计了双击 ...

  7. 移动端tap与click的区别 && 点透事件

    移动端的问题 移动端的主要问题是click会有300ms的延迟,主要原因是苹果手机在设计时,考虑到用户在浏览网页时需要放大,所以,在用户点击的300ms之后,才触发click,如果300ms之内还有c ...

  8. 10行代码搞定移动web端自定义tap事件

    发发牢骚 移动web端里摸爬滚打这么久踩了不少坑,有一定移动web端经验的同学一定被click困扰过.我也不列外.一路走来被虐的不行,fastclick.touchend.iscroll什么的都用过, ...

  9. 移动端click时间、touch事件、tap事件

    一.click 和 tap 比较 两者都会在点击时触发,但是在手机WEB端,click会有 200~300 ms,所以请用tap代替click作为点击事件. singleTap和doubleTap 分 ...

随机推荐

  1. C#效率提升总结

    1. 尽量减少装箱 尽量减少字符串之间拼接 优先用StringBuilder,因为不会多次分配内存 String.Format()内部其实是调用了StringBuilder(),所以效率很高 2. 转 ...

  2. 【文档】二、Binlog结构和内容概述

    binlog是一系列文件,这些文件包含了Mysql服务实例中数据的变化. binlog包含一系列二进制日志文件,还包含一个索引文件. 每个日志文件包含了一个4字节的魔法数,后面跟着描述数据变化的事件内 ...

  3. AngularJS Eclipse Plugin

    本文介绍如何安装和配置 AngularJS Eclipse.AngularJS Eclipse 插件是基于强大的 JavaScript 推断引擎(javascript inference engine ...

  4. 数据库~Mysql里的Explain说明

    对于mysql的执行计划可以在select前添加Explain来实现,它可以告诉我们你的语句性能如何. 下面是对explain的具体说明,也都是官方的,以后进行参考. id SELECT识别符.这是S ...

  5. python-Unix套接字

    #!/usr/bin/python #coding=utf-8 #server import socket import sys import os server_address = './test' ...

  6. elixir中的truth和true

    在elixir中, true 就是true 或者是:true 是一个原子 atom, 在其他语言中的true,这里叫做truth, 只要你不是false,nil ,就是truth, 当然 false和 ...

  7. Nginx教程(五) Nginx配置文件详解

    一. Nginx配置文件nginx.conf中文详解 #定义Nginx运行的用户和用户组 user www www; #nginx进程数,建议设置为等于CPU总核心数. worker_processe ...

  8. SharePoint 2007 form.js兼容性修改

    因SharePoint 2007发布时微软的主要IE的版本是7,所以其中不少的JS是不规范的,在新的IE8 9 10 11等版本中碰到不少的问题,以下是部分的修复,记录下,不断完善. ()语法问题 d ...

  9. 深入js之基本语法

    周末正好有空就研究了下汤姆大叔的js系列博客,虽然只是学到点皮毛,依然获益匪浅.不得不说大牛的境界岂是吾等小辈可理解. 变量: js有隐含的全局概念,意味着不声明的所有变量都是全局对象的属性. fun ...

  10. oracle用plsql登陆出错,提示ORA-12170:TNS:链接超时 --------关闭防火墙试试

    oracle用plsql登陆出错,提示ORA-12170:TNS:链接超时 但是使用sqlplus可以连接 ping 本机127.0.0.1 显示一般故障 后关闭防火墙,问题解决. ps:登录时使用@ ...