js鼠标移动、鼠标按下、鼠标释放和点击事件。

鼠标移动:mousemove

鼠标按下:mousedown

鼠标释放:mouseup

点击事件:click

<body>

<div class="box"></div>

<script>

  var box=document.getElementById("box");

  box.onmousedown=function(e){

   box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY

  }

  box.onmouseup=function(e){

   box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY

  }

  box.onmousemove=function(e){

   box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY

  }

  

  box.onclick=function(e){

   box.innerHTML="x的位置"+e.clientX+"y的位置"+e.clientY

  }

//当鼠标按下,鼠标释放,和点击事件同时执行的时候,系统依次执行鼠标按下、鼠标释放、鼠标点击。

//获取X、Y的位置有两种方法。

1.    e.clientX  e.clientY   此方法是按照窗口左上角为原点进行获取的。

2.    e.pageX  e.pageY   此方法是按照文档左上角为原点进行获取的。

 

</script>

</body>

事件委托:将子元素将要执行的事件委托给父元素,父元素执行事件时,通过事件对象,来判断是哪个子元素触发的事件。

事件冒泡:事件由内部向外部传播,外层如果有相同的事件,也会触发

js鼠标移动、鼠标按下、鼠标释放和点击事件。

上一篇:springboot参数校验


下一篇:springboot 参数校验详解