JS中的事件

缺乏、安全感 2024-04-03 08:45 82阅读 0赞

### 1、常用事件 ###

焦点类、点击类、键盘类、鼠标类、表单类、文本类

**1、焦点类**

blur 失去焦点（失焦）

focus 获得焦点（聚焦）

![2ce14e078c97465899b867bbd5ba0525.png][]

**2、点击类**

click鼠标单击

dblclick鼠标双击

![e72895d621534133a22de42607824ce3.png][]

**3、键盘类**

keydown键盘按下

keyup键盘弹起

![65414a4e3e0c4c34a780c48d39ea976a.png][]

**4、鼠标类**

mousedown 鼠标按下

mouseup 鼠标弹起

mouseover 鼠标经过

mousemove 鼠标移动

mouseout 鼠标离开

![61b11e81464d42df82386a515137703c.png][]

**5、表单类**

submit表单提交

reset表单重置

![c90e6cf7607c46b0ae9e711e5c688c06.png][]

**6、文本类**

select 文本被选定

change 下拉列表选中项改变或文本框内容改变

load页面加载完毕（要页面所有的元素都加载完毕了才会触发）

![f0a966b52bf34c138956c7e5603dcdc3.png][]![cad2d2c48aa542bb8af73394522bba9b.png][]![a2458277965e4439883c93f107bcdb35.png][]

notes：**任何一个事件都有事件句柄，事件句柄只需在事件前添加on即是。**

[2ce14e078c97465899b867bbd5ba0525.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/0dd101e2456b4690a5c74b6f7754dced.png
[e72895d621534133a22de42607824ce3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/df30bd534c2341ab830273408cd6f01c.png
[65414a4e3e0c4c34a780c48d39ea976a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/0e8e02aca3ef4881abade8745635e88f.png
[61b11e81464d42df82386a515137703c.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/3313dcd8d3e344409c93c966d58ac750.png
[c90e6cf7607c46b0ae9e711e5c688c06.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/56b9df0f87614d93b013fe0a601fa209.png
[f0a966b52bf34c138956c7e5603dcdc3.png]: https://img-blog.csdnimg.cn/f0a966b52bf34c138956c7e5603dcdc3.png
[cad2d2c48aa542bb8af73394522bba9b.png]: https://img-blog.csdnimg.cn/cad2d2c48aa542bb8af73394522bba9b.png
[a2458277965e4439883c93f107bcdb35.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/03/e18dc4002d6645428b35c9ed020b0a7b.png