手机端html touch事件,移动端事件（touchstart+touchmove+touchend），

移动端事件(touchstart+touchmove+touchend)，

移动端事件有哪些：

触摸事件

手势事件

传感器事件

(后面两个兼容性不怎么样，因此重点就是触摸事件)

触摸事件：

touch 事件

pointer 事件

(PC端可能会使用jQuery做动画，移动端一般不会，基本都是使用css3做动画)

ontouchstart (必须在元素内部才能触发)

ontouchmove (元素内外都能触发)

ontouchend (元素内外都能触发)

ontouchcancel 触摸中断，多用于系统级处理，比如在触摸时突然接了个电话(一般几乎是用不上的)

推荐使用 addEventListener 来绑定事件，除非因为兼容性原因使用 on

touch

width:200px;

height:200px;

background:pink;

margin:20px auto;

}

var box=document.getElementById("box");//box.ontouchstart=handleStart;

//box.ontouchmove=handleMove;

//box.ontouchend=handleEnd;

box.addEventListener("touchstart",handleStart,false);

box.addEventListener("touchmove",handleMove,false);

box.addEventListener("touchend",handleEnd,false);functionhandleStart(){

console.log("touchstart");

}functionhandleMove(){

console.log("touchmove");

}functionhandleEnd(){

console.log("touchend");

}

touch事件的event对象

比较重要的属性

type: "touchstart"  触发的事件

target: div#box.box 触摸的元素

changedTouches: TouchList {0: Touch, length: 1}  发生变化的触摸点

targetTouches: TouchList  目标元素上的触摸点

touches: TouchList {0: Touch, length: 1}  所有触摸点

touch

}