标签:
1) html事件处理: <div onclick = zdh()></div>
2) dom0 dom元素.onclick = function zdh(){};
3) dom2 : 3个参数
dom元素.addEventListener(事件类型 , 回调函数, true );
dom元素.addEventListener(click, zdh ,true);// 事件类型没有on true表示事件捕获类型 false表示事件冒泡类型
移除事件:
html事件处理:代码耦合性太高
dom0: dom元素.onclick = null;
dom2: removeEventListener(click,zdh,true);// 把移除事件写在回调函数中,可以实现只执行一次的效果。
IE事件:
dom元素.attachEvent("onclick" , zdh );//两个参数 要用onclick 而不是 click;
dom元素. detachEvent("onclick" , zdh);
冒泡:
先执行“我是按钮”,在弹出“我是容器” //false;
先执行“我是容器”,在弹出“我是按钮” // true;
能支持所有浏览器:== 兼容dom0,dom2,IE
var EventUtil = {
//添加
addEvent : function(ele,eventType,fun){
if( ele.addEventListener){
ele.addEventListener( eventType,fun,false);
}else if( ele.attachEvent){
ele.attachEvent( "on"+eventType,fun);
}else{
ele["on"+eventType] = fun ; // 原本是ele.onclick,但是需要加“on” 所以应用ele[];
}
} ,
//删除
deleteEvent : function(ele,eventType,fun){
if( ele.removeEventListener){
ele.removeEventListener( eventType,fun,false);
}else if( ele.detachEvent()){
ele.detachEvent( "on"+eventType,fun);
}else{
ele["on"+eventType] = null ;
}
}
};
EventUtil.addEvent(div1,"click",zdh);
EventUtil.deleteEvent(div1,"click",zdh);
function zdh(){
alert(11111);
}
点击事件 事例 点击隐藏 再点击显示;
支持事件冒泡:onmouseout,onouseover,onclick,dblclick,onmousemove,onmouseup,onmousedown
阻止事件冒泡 mouseleave ,onmouseenter
标签:
原文地址:http://www.cnblogs.com/heiheii-blog/p/5564955.html