JS事件类型(忘记来查!)

225 阅读2分钟

js事件类型有哪些?

1、事件监听的语法

元素对象.addEventListener('事件类型',要执行的函数)

2、监听事件三要素

事件源、事件类型、事件回调(被调用的函数)

3、事件类型可以分为三类

鼠标类型、键盘类型、HTML类型

4、表格分类!!!(⭐⭐⭐⭐⭐)

鼠标事件大致说明
click单击鼠标按钮时触发
dbclick双击鼠标按钮时触发
mousedown按下鼠标还未弹起时触发
mouseup释放鼠标按钮时触发
mouseover鼠标移到某个元素上方时触发
mouseout鼠标移出某个元素上方时触发
mousemove鼠标指针在元素上移动时触发
mouseenter在鼠标光标从元素外部首次移动至元素范围内触发,不参与冒泡
mouseleave在定点设备(通常是鼠标)的指针移出某个元素时被触发,不参与冒泡
键盘事件大致说明
keydown按下键盘上任意键时触发,如果按住不放,会重复触发
keyup释放键盘上的键触发
keypress按下键盘上的字符键并产生一个字符时触发;如果按住不放,会重复触发;并不是所有键(例如 ALT、CTRL、SHIFT、ESC)都会在所有浏览器中触发 onkeypress 事件
HTML事件大致说明
input当一个input, select, 或 textarea 元素的 value 被修改时触发(或者说在输入框输入的时候会实时响应并触发)
focus在元素获取焦点时触发
blur在元素失去焦点时触发
change当文本框(input或textarea或select)内容改变且失去焦点后触发
select当用户选择文本框(input或textarea)中的一个或多个字符触发
scroll当用户滚动带滚动条的元素时触发
submit当用户点击提交按钮在元素上触发
reset当用户点击重置按钮在元素上触发
load在整个页面及所有依赖资源如样式表和图片都已完成加载时触发
beforeunload当浏览器窗口关闭或者刷新时触发
unload当文档或一个子资源正在被卸载时触发

5、on+事件名称

    其实就是事件处理函数,例如:click事件,处理函数就是onclick

6、mouseout和mouseleave的区别

mouseleave 和 mouseout 是相似的;
两者的不同在于 mouseleave 不会冒泡而 mouseout 会冒泡;
这意味着当指针离开元素及其所有后代时,会触发 mouseleave;
而当指针离开元素或离开元素的后代(即使指针仍在元素内)时,会触发 mouseout。