解决部分安卓touchend不触发问题

问题描述：
js的触屏事件，主要有三个事件：touchstart，touchmove，touchend。
这三个事件最重要的属性是 pageX和 pageY，表示X坐标，Y坐标。
touchstart=在触摸开始时触发事件
touchend=在触摸结束时触发事件
touchmove=这个事件比较奇怪，按道理在触摸到过程中不断激发这个事件才对，但是在我的 Android 中，在 touchstart 激发后激发一次，然后剩余的都和 touchend 差不多同时激发。
这三个事件都都有一个 timeStamp 的属性，查看 timeStamp 属性，可以看到顺序是 touchstart -> touchmove ->touchmove -> … -> touchmove ->touchend

第一种方案：
在监听touchstart或者touchmove事件的函数里，阻止事件的默认行为event.preventDefault()，那么到touchend就能正常触发

 <div class="btn" @touchstart="touchstart" @touchend="touchend"></div>touchend(event) {//松开按键event.preventDefault();}

第二种方案：
同时绑定touchcancel和touchend事件，这样在安卓上就能通过触发touchcancel来重新展示我们的按钮。

<div class="btn" @touchstart="touchstart" @touchend="touchend" @touchend="touchcancel"></div>
touchend(event) {
//松开按键
}

第三种方案：
阻止任何父事件的 event.stopPropagation()行为，那么到touchend就能正常触发。

 <div class="btn" @touchstart="touchstart" @touchend="touchend"></div>touchend(event) {//松开按键//阻止任何父事件处理程序被执行event.stopPropagation();}

第四种方案：
问题：
如果触发了 touchmove， touchend 就不会被触发了, 而且 touchmove 没有持续触发。
解决方法：
只要在 touchstart 的时候调用下 event.preventDefault(); 即可让其他事件都正常被触发了。

$(document).on("touchstart",".btn-highlight",function(){$(this).addClass("hover");}).on("touchmove",".btn-highlight",function(event){event.preventDefault();}).on("touchcancel touchend",".btn-highlight",function(event){$(this).removeClass("hover");});

解决部分安卓touchend不触发问题相关推荐

2015.1.10 解决DataGridView SelectionChanged事件自动触发问题
2015.1.10 解决DataGridView SelectionChanged事件自动触发问题参考文章: (1)2015.1.10 解决DataGridView SelectionChanged ...
android8卡顿,Android 8.0系统曝光，解决了安卓系统卡顿的问题
原标题:Android 8.0系统曝光,解决了安卓系统卡顿的问题 8.0拟于今年5月17-19日召开的2017年谷歌I/O大会上正式宣布,之前已经曝光了该系统的一些特性,例如开发代号为奥利奥(Oero ...
鸿蒙系统卡顿解决方法,鸿蒙比安卓性能提升60%，还解决了安卓卡顿的问题，谷歌压力山大...
鸿蒙比安卓性能提升60%,还解决了安卓卡顿的问题,谷歌压力山大手机是大家生活中的必备设备,并且大家对于手机的了解程度可以说是很深刻了,知道一部手机想要使用的时间久的关键就是处理器和内存.内存小的手机 ...
android拓展内存卡,都取消存储卡拓展，而它却解决了安卓手机的大问题
原标题: 都取消存储卡拓展,而它却解决了安卓手机的大问题一直以来,安卓手机就因为其系统的开放性.可扩容等优点成为了目前绝大多数消费者选购的目标,但在智能手机飞速发展的今天,为了让智能手机更加轻薄,传 ...
airpods安卓延迟怎么解决_安卓手机投屏为什么没有声音，看AWIND奇机怎么解决的...
安卓手机投屏为什么没有声音,看AWIND奇机怎么解决的安卓手机投屏,为什么没有声音?我们用安卓手机投屏电视.电脑进行PPT演示.数据讲解的时候都是没有声音的,而看网络电视是有声音的,这是为什么呢? ...
安卓手机玩游戏卡顿怎么解决_安卓手机卡顿怎么办？5招教你变流畅，继续用三五年，媲美iPhone...
原标题:安卓手机卡顿怎么办?5招教你变流畅,继续用三五年,媲美iPhone 同事经常跟我说这一句话,永远不要相信安卓手机不卡的鬼话.还说只要是国产手机,买来第1年绝对不会卡,第2年开始绝对卡到你怀疑人 ...
安卓手机玩游戏卡顿怎么解决_安卓手机卡顿如何解决？教你四招，流畅度立刻飙升！...
原标题:安卓手机卡顿如何解决?教你四招,流畅度立刻飙升! 自从苹果手机进入中国市场,iOS与安卓用户之间就争议不断,主要原因还是手机卡顿问题.早些年,iOS流畅度遥遥领先,许多安卓用户都转为了苹果粉, ...
解决JS双击事件dblclick触发时，同时会执行click事件中的语句
双击dblclick事件,同时会执行click事件中的语句,当需要为一个元素同时添加这两个事件时,显然这不是我们想要的结果,举个实例,在最近做的canvas开发中使用鼠标画区域,鼠标单击一下开始画,鼠 ...
解决H5安卓自带浏览器video层级问题
一.问题 video标签在安卓自带浏览器下会默认处于最高层级.且会自动fixed在页面上方,loop属性失效通常如果需要video自动播放,我们会这样写: <videostyle={{ wid ...

解决部分安卓touchend不触发问题

解决部分安卓touchend不触发问题相关推荐

最新文章

热门文章