javascript事件模型Javascript事件模型1、事件流:
事件冒泡:
主要是IE浏览器用于解决事件流的技术,就是重事件源的事件被触发
它就会向自己的父节点一层层的去触发事件。
事件捕获:
是Netscape用于解决事件流的技术,就是从父节点向子节点去触发事件。
DOM事件流:
是Firefox用于解决事件流的技术,既有事件冒泡和事件捕获。
2、事件处理程序:
1.传统事件:
一个事件源只能绑定一个函数。它的兼容性比较强如果绑定多个那么后面的函数就会将前面的函数覆盖掉。
2.现代事件:
一个事件源可以绑定多个函数,函数是重后往前面执行的兼容性比较差,有些浏览器不支持。
2.1IE浏览器
attchEvent("事件名称",函数名) 添加事件
detachEvent("事件名称",函数名) 删除事件
两个方法接收两个参数
2.2DOM
addEventListener("事件名称",函数名,trueorfalse) 添加事件
removeEventListener("事件名称",函数名,trueorfalse) 删除事件
2.3解决兼容性问题
varfnClick1=function(){
alert("点我");
}
varfnClick2=function(){
alert("再点我");}
varoDiv=document.getElementById("div1");
if(document.addEventListener){//DOM
oDiv.addEventListener("click",fnClick1,true);
oDiv.addEventListener("click",fnClick2,true);
}
elseif(document.attachEvent){//IE
oDiv.attachEvent("click",fnClick1);
oDiv.attachEvent("click",fnClick2);
}
2.4事件处理程序返回值
事件处理程序
返回false值效果
click
单选按钮和复选框取消设置。对于submit按钮,表单提交被取消。对于reset按钮,表单不被重置。对于链接,不装载链接目标。
dragdrop
取消拖拽
keydown
在用户按住键不放时,取消随后的keyPRess事件
keypress
取消keypress事件
mousedown
取消默认行为(拖得开始,选择的开始,解除链接)
mouSEOver
导致对window的status或defaultStatus属性的改变被浏览器忽略
submit
取消表单提交
3、event对象
event代表事件的状态,例如触发event对象的元素、鼠标的位置及状态、按下的键等等。event对象只在事件发生的过程中才有效。event的某些属性只对特定的事件有意义。
IE浏览器的event对象属性和方法:
属性/方法
类型
是否可读写
描述
altkey
boolean
读写
指示是否按下alt键
button
Integer
读写
鼠标事件发生时候按下的鼠标按钮
0-没有按鼠标按钮
1-按了鼠标左按钮
2-按了鼠标右按钮
3-同时按下鼠标左右按钮
4-按了鼠标中间按钮
5-同时按下鼠标左按钮和中间按钮
6-同时按下鼠标右按钮和中间按钮
7-同时按下鼠标左、中、右三个按钮
cancelBubble
boolean
读写
将其设置为true可以取消事件冒泡
clientX
clientY
Integer
读写
事件发生时,鼠标指针在客户区(不包括工具栏、滚动条等)的X坐标,Y坐标
ctrlkey
boolean
读写
指示是否按下ctrl键
fromElement
element
读写
在鼠标事件中鼠标移出的元素
keyCode
Integer
读写
对于keypress事件,指示按下的键的unicode字符;
对于keydown/keyup事件,指示按下的键盘是数字表示器
offsetX
offsetY
Integer
读写
鼠标指针相对于引发的对象的X坐标,Y坐标
repeat
boolean
读
如果keydown事件被重复触发,值等于true否则false
returnValue
boolean
读写
值为false时,取消事件的默认行为
screenX
screenY
Integer
读写
鼠标指针相对于计算机屏幕的X坐标,Y坐标
shiftkey
boolean
读写
指示是否按下shift键
srcElenment
element
读写
导致事件发生的元素
toElement
element
读写
鼠标事件中,鼠标进入元素
type
string
读写
事件名称
x,y
Integer
读写
鼠标在相对于触发事件的元素的父元素X,Y坐标
DOM的event事件属性和方法:
属性/方法
类型
是否可读写
描述
altkey
boolean
读写
指示是否按下alt键
button
Integer
读