1、PC端与移动端H5事件对比
1)PC端事件:
onclick鼠标点击触发
onmousedown鼠标按下触发
onmousemove鼠标移动触发
onmouseup鼠标抬起触发
代码块:
// PC端的拖拽事件
let Obox=document.querySelector("#box");
//按下事件
Obox.onmousedown=function(e){
console.log(e);
console.log("pc按下");
//移动事件,写在按下事件里面,因为是按下-移动-抬起
Obox.onmousemove=function(e){
console.log(e);
console.log("pc移动");
}
//抬起事件
Obox.onmouseup=function(e){
console.log(e);
console.log("pc抬起");
//需要清除移动和抬起事件
Obox.onmousemove=Obox.onmouseup=null;
}
}
2)移动端触屏事件
ontouchstart手指按下触发
ontouchmove手指移动触发
ontouchend手指抬起触发
代码块:
//移动端事件
let Obox=document.querySelector("#box");
//手指按下触发
Obox.ontouchstart=function(e){
console.log(e);