首页 > 其他 > 详细

事件类型

时间:2020-01-07 23:30:55      阅读:88      评论:0      收藏:0      [点我收藏+]

Event:

  事件类型:

      change  修改事件,error  错误事件,load 加载事件,reset  重设事件,resize 重新修改大小事件,select 选择文字事件, submit 提交事件, unload 卸载事件, scroll 滚动条事件

  相关代码: 预加载封装

 

MouseEvent:

  继承方式: MouseEvent  -->   UIEvent  -->  Event -->   Object

  事件类型:

      mousedown 鼠标按下 , mouseup 鼠标释放, click 左键单击, dblclick 左键双击 , mousemove 鼠标经过, mouseout 鼠标滑过, mouseenter 鼠标进入, mouseleave 鼠标离开, contextmenu 右键菜单

   区别:mouseenter、mouseleave 不能冒泡,mouseover、mouseout能冒泡

   事件属性:

      altKey、ctrlKey、shiftKey、metaKey(win键)   

      button:    左键 0  中键1  右键2

      buttons:   左键 1  中键4  右键2

      which:      左键 1  中键2  右键3

      timeStamp:   从页面打开到触发事件的时间

      clientX 、clientY :与 x、y一样, 点击位置到页面可视的距离

      offsetX、 offsetY:  针对点击的元素到左上角的距离

      layerX、layerY:    如果点击的目标元素不是定位元素,这个只就是侦听事件对象父容器的左上角距离,如果有定位就和offsetX、offsetY相似

      pageX、pageY相对页面左上角的距离

      screenX、screenY :  相对屏幕左上角的距离

      相关代码:拖拽、多选

 

FouseEvent:

  继承方式: FouseEvent-->   UIEvent  -->  Event -->   Object

  事件类型:

      foucus 获焦 ,blur  失焦

   事件属性:

      e.relateTarget  上一个失焦对象

 

InputEvent:

  继承方式: InputEvent-->   UIEvent  -->  Event -->   Object

  事件类型:

      input

   事件属性:

      e.data:  本次输入的内容

      e.isComposing:   布尔值  输入发是否启动

      e.inputType :    输入类型

      e.insertCompositionText:  输入插入

      e.historyUndo:   历史返回

      e.insertText:   插入文本

      e.deleteContenBackward:   退格删除

      e.deleteContentForward:   delete删除

      e.deleteByCut:   剪切删除

      e.insertFromPaste:   粘贴插入

 

KeyboardEvent:

  继承方式: KeyboardEvent-->   UIEvent  -->  Event -->   Object

  事件类型:

      keydown 按下键盘  keyup  释放键盘

   事件属性:

      e.code:  "Space"

      e.key: " "

      e.keyCode、e.which:  unicode码

 

DOMMouseScroll(火狐)、WheelEvent(chrome):

    继承方式:WheelEvent  -->  MouseEvent  -->   UIEvent  -->  Event -->   Object

   事件类型:

      分别对应:DOMMouseScroll、mousewheel

    

   事件属性:

      deltaX: -0
      deltaY: -125
      deltaZ: 0
      detail: 0
      wheelDelta: 150
      wheelDeltaX: 0
      wheelDeltaY: 150 

       用来判断滚动方向

事件类型

原文:https://www.cnblogs.com/wangjingzhi/p/12163643.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!