手机端事件:如何判断手指拖动方向?
可以通过监听 'touchstart'、'touchmove'、'touchend' 等事件,获取手指的坐标信息,并计算出手指移动的距离和移动方向。判断手指拖动的方向可以根据手指移动的距离与水平和垂直方向的比较大小,若水平方向的移动距离大于垂直方向的移动距离,则判断为左右拖动;反之,则判断为上下拖动。
代码示例:
var startX, startY, endX, endY;
document.addEventListener('touchstart', function(e){
startX = e.touches[0].pageX;
startY = e.touches[0].pageY;
});
document.addEventListener('touchmove', function(e){
endX = e.touches[0].pageX;
endY = e.touches[0].pageY;
});
document.addEventListener('touchend', function(e){
var distanceX = endX - startX;
var distanceY = endY - startY;
if(Math.abs(distanceX) > Math.abs(distanceY)){
if(distanceX > 0){
//向右拖动
}else{
//向左拖动
}
}else{
if(distanceY > 0){
//向下拖动
}else{
//向上拖动
}
}
});
原文地址: https://www.cveoy.top/t/topic/lV1c 著作权归作者所有。请勿转载和采集!