DOM事件模型
DOM 0级事件模型
<input type="button" onclick="doSomething()" />
input.onclick = function(){...}
//兼容性差异
event= event || window.event;
var target = event.target || event.srcElement;
只支持一个DOM事件处理函数
DOM 2级事件模型
addEventListener(eventType,listener,userCapture)
attachEvent(eventName,handler)
冒泡机制、捕获过程
jQuery的事件操作
提供了统一的事件处理方法
允许添加多个事件处理函数
使用标准的事件名称(不带on)
事件示例作为事件处理函数的第一个参数
标准化事件实例最常用的属性
提供了统一的事件取消和阻止默认行为的方法
jQuery的事件模型
添加事件处理
on(eventType[,selector][,data],hadler)
参数1:事件的名称
参数2:选择器
参数3:数据
参数4:事件处理函数
统一方法和属性
阻止冒泡:stopPropagation()
阻止默认行为:preventDefault()
阻止冒泡和默认行为:return false
所有支持的事件
一次性的事件处理
one(eventType[,selector][,data],handler)
移除事件处理
off(eventType[,selector][,handler])
事件实例对象
红色部分表示有浏览器兼容问题,但是jQuery做了兼容处理
事件实例对象的方法
preventDefault()
stopPropagation()//阻止冒泡行为
stopImmediatePropagation()//立即阻止冒泡行为
触发事件
快捷方法
自定义事件
事件命名空间
eventName.namespace