最新版Chrome模拟器下zepto的tap事件执行两次解决办法

最新推荐文章于 2019-07-11 17:59:00 发布
最新推荐文章于 2019-07-11 17:59:00 发布
阅读量683 收藏
点赞数
分类专栏： 实战经验 web前端开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_37469563/article/details/72844552
版权
本文介绍了在最新版Chrome模拟器下，zepto的tap事件被错误地执行两次的问题及解决方案。通过进入chrome://flags/页面，禁用‘指针活动’选项，并重启浏览器，可以修复此问题。
摘要由CSDN通过智能技术生成
最新版Chrome绑定了三个事件touchend MSPointerUp pointerup，touchend是触摸相关的事件，MSPointerUp 是ie10的触摸事件，pointerup是指针事件。
可能是以前的chrome不支持pointerup事件，现在新版本支持了，然后会报错了，把zepto里面pointerup相关的事件都删除了后测试没有问题。
最低0.47元/天 解锁文章
coolemily
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
fastButton 比click更快触发，解决tap触发两次问题
05-04
fastButton可以解决两个问题：1.click在移动端使用时有300ms的延时，使用fastButton可以降低到10ms;2.tap在安卓端使用时会出现触发两次问题，使用fastButton可以解决这个问题。使用说明在压缩包中。
zepto.js中tap事件阻止冒泡的实现方法
01-19
本文实例讲述了zepto.js中tap事件阻止冒泡的实现方法。分享给大家供大家参考。具体如下： 最近在弄一个手机版的网站，本来想用jQuery Mobile，但文件太大了，所以用了zepto.js 由于移动网页中使用click事件会有延迟...
zepto.js中tap执行两遍的问题
sunranword的专栏
02-08 1593
最近做一个手机端的页面，点击导航栏，显示不同的列表用的是$("li").on("tap",function(){//load的列表});发现竟然加载了两遍，在网上找了一个答案http://www.weipxiu.com/?p=824 好像很深奥表示没有看懂。我讲tap 改成touchstart或者touchend就不会有发送2遍的现象了。$("li").on("touchstart",functi...
tap点击一次，内部程序执行两次，多次
weixin_30326741的博客
09-12 468
调试过程发现，使用 $(document).on('tap', '.children2', function () { //内部程序 }） 点击children2的时候，程序在里面执行了两次。百度得到的解释是： 原因： 如果你在页面中没有使用<div data-role="page">，jquery mobile会自己创建一个，因为它必须依赖这个。 它怎么创建...
关于zepto.js 绑定tap事件会执行两次的解决方法
weixin_30500663的博客
09-28 240
最近做了个碰到了用zepto 绑定tap事件 执行两次 本人使用 通过定时器 来解决 代码如下： $(function(){ var temp=0; $('.xx').bind('tap',function(){ 　　　　temp++; 　　　　if(temp==1){ 　　　　　　setTimeout(function(){ ...
tap 事件会触发两次问题
weixin_30670925的博客
07-11 969
　　因项目中使用 coffeeScript （http://coffee-script.org/），此处记录下用 coffeeScript 语法解决 tap 事件触发两次的问题。 在 id="button" 上绑定 tap 触摸事件如下代码： $(document).on 'tap', '#button', ()-> # 业务逻辑代码　　console...
Zepto插件touch事件的源码解读共4页.pdf.zi
10-30
这份"Zepto插件touch事件的源码解读共4页.pdf.zip"压缩文件似乎包含了对Zepto.js touch事件源码的详细解析，尽管文件列表中提及的"赚钱项目"与主题无关，我们仍将专注于探讨Zepto的touch事件。 首先，`touch`事件在...
基于zepto的插件之移动端无缝向上滚动并上下触摸滑动实例代码
09-28
主要介绍了基于zepto的插件之移动端无缝向上滚动并上下触摸滑动实例代码 ，非常具有实用价值，需要的朋友可以参考下。
通过fastclick源码分析彻底解决tap“点透”
11-29
这是最近第四次发文说tap的点透事件，我们一直对解决“点透”的蒙版耿耿于怀，于是今天老大提出了一个库fastclick，最后证明解决了我们的问题 而且click不必替换为tap了，于是我们老大就语重心长的对我说了一句，...
关于zepto在chrome中触发两次的解决方案
weixin_30765505的博客
03-03 76
复现条件：chrome 55+ 1.zepto tap的实现及double fire的原因 在监听DOM根节点的时候，touchStart后通过XY的坐标偏差，与tapTime的计时判断Tap/LongTap/doubleTap,而两次触发正是入口绑定事件的问题。 同时绑定了touchStart pointerDown，原先这种写法只是为了hack 微软的Edge浏览器和兄弟浏览器，...
windows系统的触屏设备下的谷歌浏览器和IE浏览器触屏事件 （Touch和MSPointer）
KDD_Java的博客
04-04 2805
最近遇到的需求，在windows触屏设备上，实现手指拖动div框。以下是我网上找的资料，如有什么错误，希望大家给与指正。 2019/4/4 触摸事件Touch 移动端有四个关于触摸的事件 touchstart 触摸开始的时候触发 touchmove 手指在屏幕上滑动的时候触发 touchend 触摸结束的时候触发 ...
移动前端知识的一些总结
weixin_30678821的博客
06-11 5332
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body>meta基础知识 H5页面窗口自动调整到设备宽度，并禁止用户缩放页面 ?html 代码<met...
elasticsearch基本概念与查询语法
zp的博客
07-03 4万+
序言后面有大量类似于mysql的sum， group by查询elk===elk总体架构https://www.elastic.co/cn/productsBeat基于go语言写的轻量型数据采集器，读取数据，迅速发送到Logstash进行解析，亦或直接发送到Elasticsearch进行集中式存储和分析。LogstashLogstash 是开源的服务器端数据处理管道，能够同时从多个来源采集数据、格...
Google Chrome开发者工具-移动仿真：触摸事件仿真
热门推荐
陈小峰（iefreer）的专栏
10-15 5万+
如果你在开发PAD/手机所用WEB版应用，需要在桌面审查页面元素、调试脚本，模拟移动设备尺寸、事件、位置等信息，那么可以使用Chrome开发者工具（DevTools）提供的强大的移动仿真功能，支持主流移动设备，并且支持对Android的远程调试。本文是对Google官方文档Mobile Emulate章节的翻译。
引入zepto后，用tap事件，为什么有时候会触发两次，找不到根本原因？？
u014041540的博客
06-14 1286
1原因及解决方案最新版Chrome绑定了三个事件touchend MSPointerUp pointerup，touchend是触摸相关的事件，MSPointerUp 是ie10的触摸事件，pointerup是指针事件。可能是以前的chrome不支持pointerup事件，现在新版本支持了，然后会报错了，把zepto里面pointerup相关的事件都删除了后测试没有问题。zepto目前还没修复，不...
最近一段时间在使用zepto.js的tap事件的时候,出现执行两次的bug,并报错
kerwener的博客
11-13 621
就是在引用zepto的时候,写点击事件的时候会报如下错误: Cannot read property 'trigger' of undefined 错误的来源谷歌显示是在touch.js的错误; 后来在segmentfault找到的原因,是因为最近浏览器更新出现个一个不兼容的问题,即: 出现的原因：点击tap事件直接进入两次, 执行touchend和pointerup分别一次。
zepto.js scrollTop方法在移动端chrome中失效的问题
林楠楠的脚趾有点咸的博客
12-15 6670
问题正在开发移动web,使用的是较为轻量的zepto.js,在移动端chrome测试时,突然发现返回顶部的功能失效,也没有任何报错，其他浏览器都运行通过，解决后记录下来。//这段代码在chrome移动端失效 $(document.body).scrollTop(0);解决办法有这个问题的更改为下列代码//将事件挂载到window对象上,就可以正常运行了 $(window).scrollTop(0);
如何解决Android设备上touchend不能触发bug
Cool的博客
01-23 6780
移动项目开发过程中，经常需要用到滑动的事件来处理一些效果。通常情况下，我们会通过  touchstart-&gt;touchmove-&gt;touchend  的过程来定义这个事件。这些事件的触发顺序是  touchstart, touchmove, touchmove ….. touchend  。绝大部分平板或手机也正如我们想象的那样有序执行着。但是以Android 4.0.4为首的一些可恶...
zepto radio
最新发布
11-22
zepto radio是zepto库中用于处理单选框（radio buttons）的方法。它可以用于获取选中的单选框的值，或者设置单选框的选中状态。下面是一个使用zepto radio的例子： 假设我们有以下HTML代码： ```html <form> <input type="radio" name="gender" value="male" checked> Male<br> <input type="radio" name="gender" value="female"> Female<br> <input type="radio" name="gender" value="other"> Other </form> ``` 我们可以使用zepto radio来获取选中的单选框的值： ```javascript var gender = $('input[name="gender"]:checked').val(); console.log(gender); // 输出：male ``` 我们也可以使用zepto radio来设置单选框的选中状态： ```javascript $('input[name="gender"][value="female"]').prop('checked', true); ``` 这将会把“Female”单选框设置为选中状态。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值