史上最全的常用事件:移动端事件及PC端:鼠标/键盘/表单事件

 PC端事件

  鼠标事件:
 

   onclick点击
 

   onmouseover鼠标移入
 

   onmouseout鼠标移出
 

   onmousedown鼠标按下
 

   onmouseup鼠标抬起
 

   onmousemove鼠标移动
 

   onmouseenter鼠标移入
 

   onmouseleave鼠标移出
 

   ondblclick鼠标双击
 

   oncontextmenu鼠标右击,为了防止右击div的时候出现重新加载弹框return false;
 
 
  mouseover与mouseenter的区别
 

   不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。
 

   只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。
 
 
  mouseout与mouseleave的区别
 

   不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。
 

   只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。
 
 
  
 
 

  键盘事件:给document和输入框的事件
 

  onkeydown键盘按下,不区分大小写,可以识别特殊按键
 

  onkeyup键盘弹起
 

  onkeypress键盘按下,区分大小写,shift及backspace等特殊按键触发不了
 

 
 

  表单事件:给form的事件
 

   onchange事件 修改完了提交发生的变化
 

   oninput事件 修改的过程中实时改变
 

   onreset事件 会在表单中的重置按钮被点击时发生,form支持该事件
 

   onsubmit事件 会在表单中的确认按钮被点击时发生,form支持该事件
 

   onresize事件 会在窗口或框架被调整大小时发生
 

   onblur事件 失去焦点
 

   onfocus事件 获取焦点
 
 
  
 
 
移动端事件
 
 

  touch事件
 
 
 

   touchstart 触摸开始事件
 
 
 

   touchend 触摸结束事件
 
 
 

   touchmove 在屏幕移动事件
 
 
 

   touchcancel 触摸过程被系统取消时触发的事件
 
 
 
 
  
 
 
 
 

  touch事件中常见的触摸列表
 
 
 

   touches 屏幕上所有的手指(数组)
 
 
 

   targetTouches 当前元素内的手指(数组)
 
 
 

   changedTouches 改变状态(位置的移动、开始触摸、停止触摸)的手指(数组)
 
 
 
 
  
 
 
 
 
 
  触摸信息:
 
 
 

   clientX 触摸目标在视口中的x的坐标
 
 
 

   clientY 触摸目标在视口中的y的坐标 代表手指和视窗顶部的距离(不含滚动)
 
 
 

   pageX 触摸目标在页面中的x的坐标
 
 
 

   pagey 触摸目标在页面中的y的坐标 代表手指和页面顶部的距离(包括滚动上去的部分
 
 
 

   screenX 触摸目标在屏幕中的x的坐标
 
 
 

   screenY 触摸目标在屏幕中的y的坐标
 
 
 
 
  
 
 
 
 
 
  identifier:标识触摸的唯一ID
 
 
 
 
  target:触目的DOM节点目标。
 
 
 

————————————————
版权声明:本文为CSDN博主「TimePawnshop.」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/MYTLJP/article/details/78565675

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值