事件驱动模型
事件是可以被JavaScript侦测到的行为,网页中的每个元素都可以产生出发函数事件
1.事件出发要素
事件源 事件 事件函数
2. 事件分类
2.1 鼠标事件
2.2 键盘事件
2.3 表单事件
3.4 页面事件
3. 绑定事件
3.1 常用function
3.2 标签绑定事件
<input type= "button" value = "点我" onclick = "fn()">
3.3 监听器
//IE适用
添加
element.attachEvent(event ,function);
事件源 事件 事件函数
如果绑定多个函数先执行后绑定的函数
删除
element.detachEvent(event,function);
事件源 事件 事件函数
//谷歌\火狐适用
添加
element.addEventListener(event,function);
btn.addEventListener("click",fn);
不需要前缀
如果绑定多个函数依照添加顺序执行代码
删除
element.removeEventListener(event,function);
4. 事件对象
4.1 事件源对象
1. 当时间爱你发生时,才会产生这个对象
2. 函数处理结束后,自动清除.
4.2 获取Event对象
IE: window.event
其他: e
window.onload = function(e){
var ev = e || window.event;
}
4.3 Event对象的属性
(1)鼠标事件
相对浏览器的位置 clientX clientY
相对屏幕的位置 screenX screenY
相对事件源的位置
offsetX offsetY
火狐 : layerX layerY
(2)键盘事件
keyCode 获取键盘码
常用按键键盘码
回车:13 ctrl : 17 alt : 18
shift : 16 左键 : 37 上键 : 38
右键 : 39 下键 : 40 空格键 : 42
altkey ctrlkey shiftkey 这三个键默认为false ,按下为true
(3)type属性
检测事件类型.