版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
function MobileEvent(domObj){
return{
tap:function(callback){
var startx, starty, startTime,
endx,endy,endTime;
domObj.addEventListener("touchstart",function(e){
if(e.targetTouches.length>1){
return;
}
startx=e.targetTouches[0].clientX;
starty=e.targetTouches[0].clientY;
startTime=Date.now();
})
domObj.addEventListener("touchend",function(e){
if(e.targetTouches.length>1){
return;
}
// console.log(e);
endx=e.changedTouches[0].clientX;
endy=e.changedTouches[0].clientY;
endTime=Date.now();
if(Math.abs(endx-endx)>5||Math.abs(endy-endy)>5){
return;
}
if(endTime-startTime>200){
return;
}
//调用回调函数
callback&&callback();
})
},
swipe:function(callback){
var startx, starty, startTime,
endx,endy,endTime,direction="";
domObj.addEventListener("touchstart",function(e){
if(e.targetTouches.length>1){
return;
}
startx=e.targetTouches[0].clientX;
starty=e.targetTouches[0].clientY;
startTime=Date.now();
})
domObj.addEventListener("touchend",function(e){
if(e.targetTouches.length>1){
return;
}
endx=e.changedTouches[0].clientX;
endy=e.changedTouches[0].clientY;
endTime=Date.now();
if(Math.abs(endx-startx)>60&&Math.abs(endx-startx)>Math.abs(endy-starty)){
direction=endx>startx?"right":"left";
}else if(Math.abs(endy-starty)>60&&Math.abs(endy-starty)>Math.abs(endx-endx)){
direction=endy>starty?"bottom":"top";
}else{
return;
}
//调用回调函数
callback&&callback(direction);
})
}
}
}
var box=document.querySelector(".box");
// MobileEvent(box).tap(function(){
// console.log("出发了")
// });
MobileEvent(box).swipe(function(direction){
switch(direction){
case"left":
console.log("left");
break;
case"right":
console.log("right");
break;
case"top":
console.log("top");
break;
case"bottom":
console.log("bottom");
break;
}
})
</script>
```