javascript 事件

事件流

1）冒泡型事件：IE4.0 上事件流属于冒泡型事件：

eg..如点击div-》body->html(IE6以下该元素不接收)->document->window(Mozilia 1.0及更高版本,IE不支持，也不是DOM标准的一部分）

2）捕获型事件：Netscape Navigator 4.0 捕获型事件 与上面相反的过程。 document-><div/>

3）DOM事件流

　　DOM同时支持两种事件模型且捕获型事件先发生

　　eg..在与DOM兼容的浏览器中点击<div/>   window->document->body->div->div->body->document->window

　　注意：div在冒泡和捕获阶段连续接收两次事件。

　　　　　DOM事件模型最独特的性质是文本节点也触发事件（IE中不会)

事件处理函数/监听函数

　　<div onclick="alert('I was clicked')"></div> 处理函数都小写就行了。

　　IE      window对象和每个元素都有attachEvent()和detachEvent()

　　DOM　　

1. addEventListener和removeEventListener
2. 第三个参数为事件流类型，false表示冒泡阶段,true表示捕获阶段
3. oDiv.removeEventListener("click",fnClick,false)

　　事件对象

1. IE中定位：var oEvent=window.event
2. DOM中定位：oDiv.onclick=function(){

　　　　　　　　var oEvent=arguments[0];//第一个参数就是event对象，且必须作为第一个参数。

　　　　　　　　//直接命名方式 oDiv.onclick=function(oEvent){}

　　}

　　属性及方法

　　IE中常用：

　　　　　　clientX,clientY,offsetX,offsetY,screenX,screenY

　　　　　　formElement,toElement,srcElement,

　　　　　　repeat,cancelBubble//true-停止事件向上冒泡   returnValue //false-取消事件的默认动作

　　　　　　altKey,shifKey,keyCode//(keydown或者keyup事件中，判断按键数值代码：回车-13、空格-32、回退-8）,ctrlKey,button//1左键-2右键 ,type//'click'-'mouseover'

　　　DOM中常用：
　　　　　　clientX,clientY,pageX,pageY,screenX,screenY//客户端区域

　　　　　　relatedTarget,target

　　　　　　detail,isChar,bubbles,cancelable,cancelBubble

　　　　　　altKey,shiftKey,charCode,keyCode,metaKey,ctrlKey,button,type

　　　　　　eventPhase,preventDefault(),stopPropagation(),timestamp

　　区别：

　　1.获取目标：IE中，目标包含在event对象的srcElement属性中：var oTarget=oEvent.srcElement

　　　　　　　　　　// Macintosh 上的IE同时支持srcElement和target属性

　　　　　　   DOM兼容的浏览器中，目标包含在target属性中： var oTarget=oEvent.target

　　2.获取字符代码：IE   var iCharCode=oEvent.keyCode;

　　　　　　　　　DOM oEvent.charCode

　　　　　　　　获取实际的字符 String.fromCharcode(oEvent.charCode);

　　　　　　　　如果不确定按下的按键是否包含字符： if(oEvent.isChar){ var iCharcode=oEvent.charCode;}

　　　3.阻止某个事件的默认行为

　　　　　　　　eg: document.doby.oncontextmenu=function(oEvent){

　　　　　　　　if(isIE){oEvent=window.event;oEvent.returnValue=false;}else{oEvent.preventDefault();

　　　　　　　　}

　　　　4.停止事件复制（冒泡）

　　　　　　IE　　oEvent.cancleBubble=true;

　　　　　　mozilla　　oEvent.stopPropagation();

事件类型
　　　　鼠标事件

　　　　　　事件的属性：clientX,clientY,type,target(DOM)或srcElement(IE)属性，shifKey/ctrlKey/altKey/metaKey(DOM)属性，button(mousexx事件中）

　　　　键盘事件

　　　　　　keyCode,charCode(DOM)，target(DOM)或者srcElement(IE),shiftKey/ctrlKey/altKey/metaKey(DOM)属性

　　　　HTML事件

　　　　　　load,unload,abort,error,select,change,submit,reset,resize,scroll,focus,blur

　　　　

转载于:https://www.cnblogs.com/cypergreen/archive/2013/02/22/2922909.html