ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JS事件个人小总结

2021-06-18 22:51:43  阅读:155  来源: 互联网

标签:总结 鼠标 JS 键盘 按下 事件 某个 event


事件的概念:

事件类型:在下方总结的各种事件就是事件类型
事件源:触发这个事件的元素就叫事件源
事件监听器:就是浏览器,使用addEventListener的方法添加事件监听器。关于事件监听器的更多介绍请看:https://blog.csdn.net/weixin_43606158/article/details/90728664
事件处理程序(函数):当你触发事件以后要执行的代码块就是事件处理程序。

鼠标事件:

  • 右键点击: oncontextmenu
  • 左键单击: onclick
  • 鼠标左键双击: ondblclick
  • 某个鼠标键被按下: onm ousedown
  • 某个鼠标键被松开: onm ouseup
  • 移动事件: onm ousemove
  • 移入事件: onm ouseover(PS:有事件冒泡,即从后代元素上移动经过,会重复触发事件)
  • 移出事件: onm ouseout
  • 移入事件:onmouseenter (PS:无事件冒泡,即从后代元素上移动经过,不会重复触发事件)
  • 移出事件: onm ouseleave

键盘事件:

  • onkeydown: 某个键盘的键被按下
  • onkeypress:某个键盘的键被按下或按住
  • onkeyup:某个键盘的键被松开

Input事件:

  • onchange:用户改变域的内容
  • oninput: 输入框事件
  • onsubmit:表单提交事件
  • onselect:文本被选定

全局事件:

  • onfocus:元素获得焦点
  • onblur:元素失去焦点
  • onload:某个页面或图像被完成加载
  • onresize:窗口或框架被调整尺寸
  • onunload:用户退出页面
  • onreset:重置按钮被点击
  • onerror:当加载文档或图像时发生某个错误
  • onabort:图像加载被中断
  • oncopy: 复制事件
  • onpaste: 粘贴事件
  • oncut: 剪切事件
  • onbeforeunload: 浏览器刷新事件会触发

event对象:

作用:
代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。。。

获取方法:

  • 标准:事件函数的第一个参数
  • 非标准(IE9之前):window.event
  • 兼容写法:event = event || window.event;

关于event鼠标的属性获取请看:最全的获取鼠标坐标的详细解析

键盘属性:

//获取键盘按键的虚拟键盘码
event.which 
event.keyCode

//获取是否按下了键盘上的ctrl键
//返回true表示按下了ctrl并保持按下状态
event.ctrlKey

//获取是否按下了键盘上的shift键
event.shiftKey

//获取是否按下了键盘上的alt键
event.altKey

所有的事件都会持续更新。。。
笔者项目开发过程中用到一个就会总结一个

 

标签:总结,鼠标,JS,键盘,按下,事件,某个,event
来源: https://blog.51cto.com/u_15275953/2926882

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有