移动端多点触摸touchend 事件没有正常触发

移动端触屏事件主要是touchstart,touchmove,touchend

执行顺序touchstart(开始) - touchmove(移动) - touchend(结束)

for (var i = 0; i < dom.length; i++) {
  dom[i].addEventListener(‘touchstart‘, function (e) {
    .....
  }, false);
    dom[i].addEventListener(‘touchend‘, function (e) {
      .....
    }, false);}

只触摸一个的话是可以正常执行touchstart-touchend的,

但是多点触摸时,先触摸的dom结束时没有触发touchend事件,导致出现bug

解决方法是在触发touchstart 事件时调用e.preventDefault();

时间: 2024-11-08 15:05:40

移动端多点触摸touchend 事件没有正常触发的相关文章

WPF中的多点触摸事件

原文:WPF中的多点触摸事件 UIElement在WPF4下添加了很多支持多点触摸的事件,通过它们可以在硬件支持的情况下处理多点触摸,以下通过代码来说明通过处理这些事件,我们可以做些什么: 一.触摸相关的多种事件,跟鼠标事件是对应的,通过这些事件可以获取到多个触摸的鼠标点,并进行相应的处理 public static readonly RoutedEvent TouchDownEvent; public static readonly RoutedEvent TouchEnterEvent; p

21、多点触摸技术

什么是多点触摸技术 多点触摸是一项很早就使用的技术,从IPhone第一代就支持多点触摸.要想了解什么叫多点触摸,首先应了解什么是单点触摸.早期的触摸屏无论有多少个手指接触到屏幕,系统只会认为第1个接触到屏幕的手指是有效的,后来接触到屏幕的手指将被忽略.这就是所谓单点触摸,单点就是指第1个接触到屏幕的手指. 了解了单点触摸,多点触摸就很容易理解了.所谓多点触摸就是系统同时接受多个手指触摸屏幕的动作.这些手指的按下.移动等操作所生成的数据都可以通过程序获取.根据这些数据的变化可以做出很多有趣的应用,

移动端前端常见的触摸相关事件touch、tab、swipe等整理

前端的很多事件在PC端和浏览器端可公用,但有些事件却只在移动端产生,如触摸相关的事件 本文整理了移动端常见的一些事件,包括原生支持的click.touch.tab.swipe事件,也有定义型的gesture手势事件(目前只是一个概念,使用的时候需封装模拟) 使用到的是移动端的Chrome浏览器,本文只对该浏览器进行调试,其他浏览器暂未考虑到 一.事件定义及分类 1. click事件 单击事件,类似于PC端的click,但在移动端中,连续click的触发有200ms ~ 300ms的延迟 2. t

web移动端触摸滑动事件

web移动端触摸事件的范例~~~ 注意:1.如果不是内联元素,获取style的属性值前需先赋值~不然为Null. 2.亲测andriod 手机 MX4内置浏览器运行妥妥的~~但是微信浏览器并不支持~原因未找到. 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" Content="text/html; charset=utf-8;">

学习记录 -- 移动端的触摸事件

移动端的触摸事件分为三个 1.touchstart 手指刚放上添加事件的元素时触发 2.touchmove   手指在添加事件的元素上移动时触发 3.touchend 手指在添加事件的元素上离开时触发 每个事件都包含三个事件属性 a.touches 正在触摸屏幕的所有手指的一个列表 b.targetTouches  正在触摸当前DOM元素上的手指上的一个列表 c.changedTouches    涉及当前事件的手指的一个列表 原文地址:https://www.cnblogs.com/hros/

Quick cocos2dx-Lua(V3.3R1)学习笔记(十三)-----继续触摸事件之多点触摸

在前面,我们提过了单点触摸,下面我们就试一下多点触摸的用法(我用的是cocos code ide进行手机调试,不会的,进入前一篇查看) function MainScene:ctor() local sprite = display.newSprite("close.png") --自己随便找个图片资源吧 sprite:align(display.CENTER, display.cx, display.cy) sprite:addTo(self) sprite:setTouchEnab

Touch事件 移动端touch触摸事件

<!-- HTML5 --> <!DOCTYPE html> <html> <head> <title>TouchEvent测试</title> <meta charset="gbk"> </head> <body> <h2>TouchEvent测试</h2> <br /> <div id="version" styl

解决移动端页面滚动后不触发touchend事件

解决移动端页面滚动后不触发touchend事件 问题 在移动端页面进行优化时,一般使用touch事件替代鼠标相关事件.用的较多的是使用touchend事件替代PC端的click和mouseup事件. 可是,touchend事件在页面滚动时有个问题.在滚动完毕后,假设当前触点的位置所指的元素绑定了touchend事件,这时便会触发该元素的touchend事件,造成误操作. 解决方法 解决方法非常easy.就是在页面滚动时停止touchend事件冒泡.这样就能够防止触发touchend事件. 用法

quojs 及 转:11个处理触摸事件和多点触摸的JS库

QuoJs官方文档http://www.360doc.com/content/15/0504/18/11984479_468037372.shtml ==== 11个处理触摸事件和多点触摸的JS库 摘要:触摸屏是现在所有智能手机的标配,还包括各种平板设备,而且很多桌面也慢慢在开始支持触摸操作.要开发支持触摸屏设备的Web应用,我们需要借助浏览器的触摸事件来实现. 触摸屏是现在所有智能手机的标配,还包括各种平板设备,而且很多桌面也慢慢在开始支持触摸操作.要开发支持触摸屏设备的Web应用,我们需要借