您好!欢迎访问家园网-www.jy.wang!

家园网

Document 事件完整分类(修订版)

网络 作者:本站 点击:

Document 事件完整分类(修订版)

一、文档加载与卸载事件(5个)

  1. DOMContentLoaded

  2. readystatechange

  3. load

  4. beforeunload

  5. unload

二、鼠标事件(13个)

  1. click

  2. dblclick

  3. mousedown

  4. mouseup

  5. mousemove

  6. mouseover

  7. mouseout

  8. mouseenter

  9. mouseleave

  10. contextmenu

  11. wheel

  12. selectstart

  13. select(当用户在<input><textarea>中选择文本时触发)

三、键盘事件(3个)

  1. keydown

  2. keyup

  3. keypress

四、焦点事件(4个)

  1. focus

  2. blur

  3. focusin

  4. focusout

五、表单事件(6个)

  1. input

  2. change

  3. submit

  4. reset

  5. invalid

  6. select(与鼠标事件中的select是同一个事件,因作用域不同可归入此类)

六、剪贴板事件(4个)

  1. copy

  2. cut

  3. paste

  4. beforecopy

七、视图与滚动事件(3个)

  1. scroll

  2. resize

  3. wheel(已在鼠标事件中列出)

八、拖拽事件(7个)

  1. drag

  2. dragstart

  3. dragend

  4. dragenter

  5. dragleave

  6. dragover

  7. drop

九、触摸事件(5个)

  1. touchstart

  2. touchmove

  3. touchend

  4. touchcancel

  5. gesturestart(非标准)

十、指针事件(10个)

  1. pointerdown

  2. pointermove

  3. pointerup

  4. pointercancel

  5. pointerover

  6. pointerout

  7. pointerenter

  8. pointerleave

  9. gotpointercapture

  10. lostpointercapture

十一、动画与过渡事件(6个)

  1. animationstart

  2. animationend

  3. animationiteration

  4. transitionstart

  5. transitionend

  6. transitioncancel

十二、网络与连接事件(2个)

  1. online

  2. offline

十三、页面可见性与全屏事件(3个)

  1. visibilitychange

  2. fullscreenchange

  3. fullscreenerror

十四、文档选区事件(1个)

  1. selectionchange

十五、安全策略事件(1个)

  1. securitypolicyviolation

十六、剪贴板事件补充(1个)

  1. beforecut

十七、非标准或已废弃事件(部分)

  1. beforeprint

  2. afterprint

  3. abort

  4. error

  5. search(用于input type="search")


关于 select 事件的说明

select 事件有两个主要应用场景:

  • 在 <input> 和 <textarea> 上:当用户选择文本时触发

  • 在 document 上:也可以监听到文本选择,但通常推荐使用更专门的 selectionchange 事件

示例:

document.addEventListener('select', function(event) {
    console.log('文本被选中');
    // 注意:document上的select事件支持度有限,更常用的是针对具体输入元素的select事件});

总计:约79个事件(已包含select事件)

标签: