当前位置: 首页 > Web前端 > HTML5

移动端-触摸事件

时间:2023-04-05 01:14:47 HTML5

1.touchstart触发dom.addEventListener('touchstart',function(e){});startX=e.touches[0].clientX;手指触摸屏幕时事件返回e对象包含的移动端特有属性:targetTouches:目标元素的所有当前触摸changedTouches:页面最新变化的所有触摸touches:页面上的所有触摸2.touchmove触发器手指在屏幕上滑动时连续dom.addEventListener('touchmove',function(e){});事件返回的e对象包含特定于移动设备的属性:targetTouches:目标元素的所有当前触摸changedTouches:页面上最近更改的所有触摸touches:页面上的所有触摸3.touchendDom.addEventListener('touchend',funciton(e){})手指离开屏幕时触发;//在touchend中,touches获取不到触摸对象,//因为触摸已经结束,changedTouches获取到触摸对象//console.log(e);//endX=e.touches[0];未定义endX=e.changedTouches[0].clientX;事件返回的e对象包含特定于移动设备的属性:changedTouches:页面上的最新更改所有触摸touchcancel:当系统停止跟踪触摸时触发。(不经常使用)在touchend事件期间,该事件会记录changeTouches4。e.touches[0]clientX:触摸目标在视口中的X坐标。clientY:触摸目标在视口中的Y坐标。pageX:页面中触摸目标的x坐标。pageY:触摸目标在页面中的y坐标。screenX:触摸目标在屏幕上的x坐标。screenY:触摸目标在屏幕上的y坐标。