鼠标事件 (继承MouseEvent接口)
鼠标事件 | 描述 |
---|---|
click |
按下鼠标时触发 |
dblclick |
双击鼠标时触发 |
mousedown |
按下鼠标键时触发 |
mouseup |
释放按下鼠标键触发 |
mousemove |
鼠标在节点内部移动触发,持续移动,事件会持续触发(会有性能问题) |
mouseenter |
鼠标进入节点触发,进入子节点不会触发。(在节点内只会触发一次) |
mouseover |
鼠标进入节点触发,进入子节点会再一次触发 |
mouseout |
鼠标离开节点触发,离开父节点也会触发 |
mouseleave |
鼠标离开节点触发,离开父节点不会触发 |
contextmenu |
鼠标右键(右键菜单)前触发,或按下右键菜单时触发 |
wheel |
滚动鼠标的滚轮时触发,继承WheelEvent接口 |
触发顺序: mouseDown > mouseup > click > dblclick
mouseover 和 mouseenter 的共同点:鼠标进入一个节点触发
区别:
- mouseover 会在子节点触发多次
- mouseenter 只触发一次
mouseout 和 mouseleave 共同点: 鼠标离开一个节点时触发
区别:
- 在父元素内部离开一个子元素时,mouseout事件会触发。
- 在父元素内部离开一个子元素时,mouseout事件不会触发。
键盘事件 (继承KeyboardEvent接口)
键盘事件 | 描述 |
---|---|
keydown |
按下键盘时触发 |
keypress |
按下有值的键触发,(无值键Ctrl、Alt、Shift、Meta ) ,会先出发keydown |
keyup |
松开键盘时触发 |
用户一直按键不松开:
1.keydown
2.keypress
3.keydown
4.keypress
5. ...(重复上面过程)
6.keyup
进度事件 (继承ProgressEvent接口)
描述资源加载的进度。主要由AJAX、、