复现条件：chrome 55+

1.zepto tap的实现及double fire的原因

在监听DOM根节点的时候，touchStart后通过XY的坐标偏差，与tapTime的计时判断Tap/LongTap/doubleTap,而两次触发正是入口绑定事件的问题。 

同时绑定了touchStart pointerDown，原先这种写法只是为了hack 微软的Edge浏览器和兄弟浏览器，但是chorme 从55版本时就开始支持pointer。而我浏览版本很高，导致了这个问题可以复现。

Timline中对js监听图

可以发现 回调函数被执行了两遍

2.zepto tap目前在touch端的的兼容

身边可测试机型有限

ios9-10没问题

安卓 4.4 chrome UC也无此问题

3.解决方案
1.更改源码 对useragent进行判断bind eventListener时区别bind
2.节流函数/全局变量Flag
3.tap换成click

关于zepto在chrome中触发两次的解决方案的更多相关文章

  1. Chrome中无法断点调试的解决方案

    chrome的调试功能实在是太强大了,相比之下ie的就是一垃圾. 最近在调试时出现一种情况,死活不能设置断点,也不能跟踪调试,这下抓狂了. JS也是非常简单的,也没有压缩.为什么就不能调试呢? 网上狂 ...

  2. 解决jQuery中dbclick事件触发两次click事件

    首先感谢这位小哥!http://qubernet.blog.163.com/blog/static/1779472842011101505853216/ 太长姿势了. 在jQuery事件绑定中,dbc ...

  3. Google Chrome中的高性能网络(二)

    Chrome Predictor的预测功能优化 Chrome会随着使用变得更快. 它这个特性是通过一个单例对象Predictor来实现的.这个对象在浏览器内核进程(Browser Kernel Pro ...

  4. Chrome 中的 JavaScript 断点设置和调试技巧 （转载）

    原文地址:http://han.guokai.blog.163.com/blog/static/136718271201321402514114/ 你是怎么调试 JavaScript 程序的?最原始的 ...

  5. Web 性能优化：Preload与Prefetch的使用及在 Chrome 中的优先级

    摘要: 理解Preload与Prefetch. 原文:Web 性能优化:Preload,Prefetch的使用及在 Chrome 中的优先级 作者:前端小智 Fundebug经授权转载,版权归原作者所 ...

  6. Google Chrome中的高性能网络-[译]《转载》

    以下内容是"The Performance of Open Source Applications" (POSA)的草稿, 也是The Architecture of Open S ...

  7. iframe onload事件触发两次

    标准参考 关于 HTML 4.01 规范中 onload 内在事件说明:http://www.w3.org/TR/html401/interact/scripts.html#adef-onload 关 ...

  8. chrome中不可见字符引发的float问题

    起因是刷知乎时碰到这么个问题:https://www.zhihu.com/question/41400503 问题代码如下: <!DOCTYPE html> <html lang=& ...

  9. Chrome中的Device模块调式响应性设计

    Chrome中的Device模块调式响应性设计 阅读目录 启用Device模块 Device模块设置介绍 自定义预设介绍 查看media queries 触发触摸事件 回到顶部 启用Device模块 ...

随机推荐

  1. 使用python爬取东方财富网机构调研数据

    最近有一个需求,需要爬取东方财富网的机构调研数据.数据所在的网页地址为: 机构调研 网页如下所示: 可见数据共有8464页,此处不能直接使用scrapy爬虫进行爬取,因为点击下一页时,浏览器只是发起了 ...

  2. cf734 E. Anton and Tree

    这个题的题意还是很劲的.搞了好久才知道是怎么变得. (假设已经缩好了点,每次边中间颜色不同的,然后和就和他外面的相同,继续再变这个大的,依次类推,最多就是树的直径D/2) (还是英语水平太弱了(吐槽+ ...

  3. ES6 - 变量的解构赋值学习笔记

    变量的解析赋值 数组的解析赋值 es6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这就称为解构. var a = 1; var b = 2; var c = 3; //在es6中允许写成 ...

  4. Angular - - filter 过滤器

    Filter Ng里的过滤器. currency:把一个数字格式化成货币模式(如$1,234.56).当没有提供任何货币符号时,默认使用当前区域的符号. 使用: HTML:{{ currency_ex ...

  5. C# 启动停止SQLServer数据库服务器

    C#启动停止SQL数据库服务方法之一: 在命令行里填写命令:net start/stop mssqlserver C#启动停止SQL数据库服务方法之二: 通过C#代码实现: class Program ...

  6. 如何利用jquery 实现表格数据的搜索功能

    在表格的操作中,常常会遇到通过关键字来搜索结果,这个功能用jquery的filter实现非常简单. 我以一个小例子说明: <table> <thead> <tr cols ...

  7. js阻止表单提交的两种方法

    下面直接看代码. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  8. 面试之Java知识整理

    1.面向对象都有哪些特性 继承.封装.多态性.抽象 2.Java中实现多态的机制是什么? 继承与接口 3.Java中异常分为哪些种类 3.1按照异常需要处理的时机分为编译时异常(CheckedExce ...

  9. vb是如何连接数据库的

    vb是如何连接数据库的         刚开始学习数据库时 ,对数据库很不了解,尤其是模块中的代码.照着抄都有很多错的,每一句到底是什么意思呢,根本不懂.于是我就花费了大量的时间去查每一句代码的具体作 ...

  10. iOS程序生命周期 AppDelegate

    iOS的应用程序的生命周期,还有程序是运行在前台还是后台,应用程序各个状态的变换,这些对于开发者来说都是很重要的. iOS系统的资源是有限的,应用程序在前台和在后台的状态是不一样的.在后台时,程序会受 ...