事件类型

事件类型

事件类型简介：

javascript事件类型分为ui事件，鼠标事件，键盘事件，html事件和变动事件(当底层的dom结构发生变化时触发)，下面我们将详细的讲解js中的事件类型以及其中的事件。

鼠标事件：

click：鼠标单击事件，按下主鼠标键(一般为左键)或者回车键触发

dblclick：鼠标双击事件，双击主鼠标键时触发

mousedown：用户按下任意鼠标按钮时触发

mouseup：用户松开鼠标键时触发

mouseout：当用户将鼠标从一个元素移入另外一个元素时触发，另外一个元素可以是这个元素外面的元素也可以是其子元素

mouseover：当用户将鼠标移入元素时触发

mousemove：当用户将鼠标在元素上面移动时触发

光标的位置：event.clientX和event.clientY指的是客户端的坐标，当页面有滚动条时则不能准确的反应真实的坐标。

event.screenX和event.screenY指屏幕的坐标，将会算上滚动条的距离，这时的位置才算是准确的位置

修改键：(在设置快捷键时用处非常大)分别为event.shiftKey,event.altKey,event.ctrlKey,metaKey(兼容性有问题)，这些属性都是boolean类型，如果对应的值为true则表示按键被按下了，如果对应的值为false则表示对应的按键没有被按下。

相关元素：非ie的相关元素为relatedTarget而ie中的相关元素为fromTarget和toTarget,它们都是相对于事件mouseout和mouseover而言的

鼠标按钮：event.button表示单击时按下的是哪个键，这个值有兼容性的差异

键盘事件：

keydown：当用户按下键盘上的任意键时触发

keypress：当用户按下键盘上的字符键时触发

keyup：当用户释放键盘上的键时触发

键码：event.keyCode用于识别按下的是键盘上面的哪个键

html事件：

load：当页面加载完后在window上面触发（window.onload）;

select：当用户选中文本框(input或者textarea)中的一个或多个字符时触发；

change：当文本框中的内容改变而且文本框失去焦点时触发事件；如果需要实时的进行监控，可以使用propertychange(ie)和input(绝大部分非ie，该事件需要用addEventListener注册才有效)

submit：当用户单击提交按钮时触发

reset：当用户单击重置按钮时触发

resize：当框架或window窗口大小变化时在window窗口或框架上面触发

focus：当页面元素获得焦点时触发

blur：当页面元素失去焦点时触发

scroll：当用户滚动带滚动条元素的内容时，在该元素上面触发

到此我们常见的事件都在这里了

经验：事件在项目中是经常用到的，掌握好这些基础知识能在很大的程度上帮助到你，这点我有着亲身的体会