开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第9天,点击查看活动详情
鼠标事件
鼠标点击
每当用户用鼠标点击时就会触发点击事件
- 单击事件 (clcik) 每一次点击鼠标都会触发这个事件
- 双击事件 (doubleclcik) 当用户快速点击两次时触发,当然不管你有多快,这两次点击也会触发单击事件
- 右击事件 (contextclick) 用户右键点击时才会触发的事件,一般网站都会是默认的自定义右键菜单。我们也可以通过一些方法来改变这默认的自定义右击菜单。比如:百度地图,他就不是寻常的浏览器默认菜单。
鼠标按下松开移动
每当用户用操作鼠标时就会触发鼠标按下、鼠标移动、鼠标松开事件
- 按下事件 (mousedown) 每一次按下鼠标都会触发这个事件
- 移动事件 (mousemove) 当用户鼠标在某个容器内移动时触发,不管你有多快,他都会触发鼠标移动事件
- 松开事件 (mouseup) 用户结束按下操作松开鼠标时会触发的事件。
这三个事件作用在一起可以实现拖动元素的效果
鼠标移入移出
鼠标移动移出有两种方法:
第一种: 如果有一个子元素在他里面,当鼠标移入移出经过子元素时,不会触发这个事件
- 移入 mouseenter
- 移出 mouseleave
第二种: 如果有一个子元素在他里面,当鼠标移入移出经过子元素时,会触发这个事件
- 移入 mouseeover
- 移出 mouseout
键盘事件
键盘事件多用于window,document和input输入框等
- 键盘按下 keydown
- 键盘松开 keyup
可以用来判断输入的值是否为回车键
表单事件
- focus 获取焦点时触发
- blur 失去焦点时触发
- change 对比获取焦点时和失去焦点时,如果有改变就会触发事件
- input 在发生改变时会触发的事件
- submit 点击提交按钮触发,前提是表单中有提交按钮,默认会刷新页面,我们可以将其阻止
- reset 点击重置按钮时触发
submit和reset两个事件的事件源于其他四个事件不一样,他们两个呢,是对表单进行操作