一、鼠标事件
- mousedown:鼠标按钮被按下时触发。不能通过键盘触发。
- mouseup:鼠标按钮被释放弹起时触发。不能通过键盘触发。
- click:单击鼠标左键或者按下回车键时触发。
- dblclick:双击鼠标左键时触发。
- mouseover:鼠标移入目标元素或后代元素上时会触发。
- mouseout:鼠标离开目标元素或后代元素时会触发 。
- mouseenter:鼠标移入元素范围内触发,该事件不冒泡,即鼠标移到其后代元素上时不会触发。
- mouseleave:鼠标移出元素范围时触发,该事件不冒泡,即鼠标移到其后代元素时不会触发。
- mousemove:当鼠标移入被选元素内后,任意移动一个像素点都会触发 。
注:
在一个元素上相继触发mousedown和mouseup事件,才会触发click事件。两次click事件相继触发才会触发dblclick事件。
1
mousedown -> mouseup -> click ->mousedown -> mouseup -> click -> dblclick
如果取消 了mousedown或mouseup中的一个,click事件就不会被触发。直接或间接取消了click事件,dblclick事件就不会被触发了。
二、触摸事件
- touchstart:当手指触摸屏幕时触发;即使已经有一个手指放在了屏幕上也会触发。
- touchmove:当手指在屏幕上滑动时连续地触发。调用preventDefault()可以阻止滚动。
- touchend:当手指在屏幕上移开时触发。
- touchcancel:当系统停止跟踪触摸时触发。关于此事件的确切触发时间,文档中没有明确说明。
注:
点一下的触发顺序
1
touchstart -> touchend -> mouseover-> mousedown -> mouseup -> click
移动端的click事件会延迟300ms左右触发事件回调。等待 300 毫秒,以判断用户是否再次点击了屏幕