javascript事件:
什么叫事件:当我们点击一个按钮的时候,会弹出一个对话框。在JavaScript中,“点击”这个事情就看作一个事件。“弹出对话框”其实就是我们在点击事件中做的一些事。
事件应该有3部分:事件源: 触发谁的事件
事件类型: 这个事件是干啥的,是点击呢,还是移动呢
事件处理函数: 事件过程做的一些事
事件对象event
每触发一个事件都会生成事件对象
事件对象 包含对事件的描述信息:你触发一个点击事件的时候,你点在哪个位置了,坐标是多少。你触发一个键盘事件的时候,你按的是哪个按钮
在每一个事件处理函数的行参位置,默认第一个就是 事件对象
获取事件对象:
IE兼容写法:e = e || event
e.x(x轴坐标点信息) e.y(y轴坐标点信息)
点击事件的光标坐标点获取:
每一个点击事件的坐标点都不是一对,因为要有一个相对的坐标系:
1. 相对事件源(你点击的元素)offsetX,offsetY
2. 相对于浏览器窗口(clientX,clientY)
3. 相对于页面(pageX,pageY)
常见的事件:
浏览器事件:load : 页面全部资源加载完毕
scroll : 浏览器滚动的时候触发
resize 页面大小事件
鼠标事件:
click :点击事件
dbclick :双击事件
contextmenu : 右键单击事件
mousedown :鼠标左键按下事件
mouseup :鼠标左键抬起事件
mousemove :鼠标移动
mouseover :鼠标移入事件
mouseout :鼠标移出事件
mouseenter :鼠标移入事件
mouseleave :鼠标移出事件
键盘事件:
keyup : 键盘抬起事件
keydown : 键盘按下事件
keypress : 键盘按下再抬起事件
表单事件:
change : 表单内容改变事件
input : 表单内容输入事件
submit : 表单提交事件
触摸事件:
touchstart : 触摸开始事件
touchend : 触摸结束事件
touchmove : 触摸移动事件
焦点事件:失去焦点onblur 获取焦点onfocus