检测是否存在e.touches.length
,如果存在则支持触摸事件
记录第一次手指按下的位置 同时监听手指移动和手指松开事件。
function touchStart(e) {
if(!e.touches.length) return;
var touch = e.touches[0]
startX = touch.pageX;
startY = touch.pageY;
elem.addEventListener('touchmove',touchMove,false);
elem.addEventListener('touchend',touchEnd,false);
}
手指移动
function touchMove(e) {
e.preventDefault();
if(!e.touches.length) return;
var touch = e.touches[0],
pgx = touch.pageX,
pgy = touch.pageY;
x = pgx - startX,
y = pgy - startY;
//逻辑处理
}
手指松开
function touchEnd() {
//逻辑处理
}
开始监听手指按下事件
if("ontouchstart" in document) {
elem.addEventListener('touchstart',touchStart,false);
}
上述操作,可以基本完成简单的触摸事件监听!
如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!
如无特殊声明,文章均为原创,若有不正之处,万望告知。转载请附上原文地址,十分感谢!