html 禁止触摸事件,html5的触摸事件

1.触摸事件有哪些

touchstart，touchmove，touchend

2.分别什么时候触发

touchstart事件：当手指触摸屏幕时候触发，即使已经有一个手指放在屏幕上也会触发。

touchmove事件：当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间，调用preventDefault()事件可以阻止滚动。

touchend事件：当手指从屏幕上离开的时候触发。

3.每个事件中的touch对象如何获得

touches：表示当前跟踪的触摸操作的touch对象的数组。

targetTouches：特定于事件目标的Touch对象的数组。

changeTouches：表示自上次触摸以来发生了什么改变的Touch对象的数组。

最好统一使用一个touch对象数组

4.如何获得touch对象的相应属性

clientX：触摸目标在视口中的x坐标。

clientY：触摸目标在视口中的y坐标。

identifier：标识触摸的唯一ID。

pageX：触摸目标在页面中的x坐标。

pageY：触摸目标在页面中的y坐标。

screenX：触摸目标在屏幕中的x坐标。

screenY：触摸目标在屏幕中的y坐标。

target：触目的DOM节点目标。

5.举例子

function load (){

document.addEventListener('touchstart',touch, false);

document.addEventListener('touchmove',touch, false);

document.addEventListener('touchend',touch, false);

function touch (event){

var event = event || window.event;

var oInp = document.getElementById("inp");

switch(event.type){

case "touchstart":

oInp.innerHTML = "Touch started (" + event.touches[0].clientX + "," + event.touches[0].clientY + ")";

break;

case "touchend":

oInp.innerHTML = "
Touch end (" + event.changedTouches[0].clientX + "," + event.changedTouches[0].clientY + ")";

break;

case "touchmove":

event.preventDefault();

oInp.innerHTML = "
Touch moved (" + event.touches[0].clientX + "," + event.touches[0].clientY + ")";

break;

}

}

}

window.addEventListener('load',load, false);