前端杂谈 · Web

鼠标事件

小编 · 7月26日 · 2020年

鼠标事件种类

  • click 点击事件
  • dblclick 双击事件
  • mousedown 鼠标按下按键
  • mouseup 鼠标释放按键
  • mousemove 鼠标在某个节点内部移动时触发
  • mouseenter 进入某个节点时触发,进入节点后移动鼠标不会触发
  • mouseover 进入某个节点时触发,进入子节点时会再次触发
  • mouseout 离开某个节点时触发,离开子节点也会触发
  • mouseleave 离开某个节点时触发,离开子节点不会触发
  • contextmenu 按下右键触发,或者按下上下文菜单触发
  • wheel 滚动滚轮时触发
鼠标事件

click 事件触发

用户先在同一个位置完成 mousedown,再完成 mouseup, 然后才会触发 click.

dblclick 事件触发

会在两次 click 事件触发后触发

mouseover 和 mouseenter 区别

都会在进入一个节点时触发,两者的区别是,mouseenter 只触发一次,而鼠标在节点内部移动时,mouseover 会在子节点上触发多次

mouseout 和 mouseleave 区别

都会在离开一个节点时触发,两者的区别是,mouseout 在离开一个子节点时会触发,而 mouseleave 不会

滚轮的实例属性

  • deltaX 表示滚轮的水平滚动量
  • deltaY 表示滚轮的垂直滚动量
  • deltaZ 表示滚轮的 Z 轴滚动量
  • deltaMode 表示上面三个属性的单位,0 是像素,1 是行,2 是页
0 条回应

必须 注册 为本站用户, 登录 后才可以发表评论!