复现条件: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. Extjs换肤+cookie皮肤记忆功能

    http://www.myext.cn/kaifa/a_102.html    Ext之家 <title>无标题页</title>    <link rel=" ...

  2. spring mvc handler的三种方式

    springmvc.xml 三种方式不能针对一个controller同时使用 <?xml version="1.0" encoding="UTF-8"?& ...

  3. Android开发系列之Context

    相信大家对于Context应该非常熟悉,但是Context到底是什么意思呢?到底指的是什么东西呢?我们可以理解为当前对象在程序中所处的一个环境,一个与系统交互的过程.Android系统的上下文对象,即 ...

  4. KVO,看我就够了!

    概述 KVO全称Key-Value-Observing,也叫键值监听,是一种观察者设计模式.提供了一种机制,当指定的对象的属性被修改后,对象就会收到一个通知.也就是说每次指定的被观察的对象的属性被修改 ...

  5. js json和字符串的互转

    json与字符串的互转:    下面格式两种只是针对引号有稍微的区别 var result = JSON.parse("{\"a\":\"擦擦\",\ ...

  6. linux 中用python实现终端命令行命令

    在python代码中实现和在终端中输入的命令行一样的效果,以命令(audacious -p &)为例,该代码实现用audacious在后台播放音乐的功能,当然前提是安装了audacious. ...

  7. SourceTree 将本地已有的git项目推送到远程git仓库

    1.在远程git仓库创建对应的项目: 2.用命令行生成本地的ssh key; 3.把公钥粘贴远程仓库对应的位置: 4.SourceTree 设置远程仓库的地址: 5.把本地对应的分支推送到远程仓库: ...

  8. Brainfuck与Ook!编程语言解析与解密

    MarkdownPad Document html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,ab ...

  9. javascript 终止函数执行操作

    1.如果终止一个函数的用return即可,实例如下:function testA(){    alert('a');    alert('b');    alert('c');}testA(); 程序 ...

  10. 微信jsSDK公众号开发时网页提示 invalid signature错误的解决方法

    微信公众号开发jsSDK,链接地址不能加?参数,可以通过#传递参数. 不然.页面wx.ready()时就会报错,用 wx.error(function (res) { alert("接口验证 ...