JS事件——添加、移除事件

  • A+
所属分类:Web前端
摘要

使用 removeEventListener(event, function) 方法来移除 addEventListener() 方法添加的事件句柄。 

element.addEventListener(eventfunctionuseCapture) 方法用于向指定元素添加事件句柄。
 
event:  必须。字符串,指定事件名。
注意: 例 使用 "click" ,而不是使用 "onclick"。
 
function:  触发函数
 
useCapture:  可选。布尔值,指定事件是否在捕获或冒泡阶段执行。
可能值:

  • true - 事件句柄在捕获阶段执行
  • false- 默认false。事件句柄在冒泡阶段执行

使用 removeEventListener(eventfunction) 方法来移除 addEventListener() 方法添加的事件句柄。 

重点:此方法不兼容IE8及更早版本浏览器

 

element.attachEvent(eventfunction,)方法用于向指定元素添加事件句柄。

使用detachEvent(eventfunction)方法来移除 attachEvent() 方法添加的事件句柄。

重点:此方法只支持IE8以及更早版本浏览器,参数event 必须是"onclick"与addEventListener不同,

并且相对于addEventListener少了一个参数,此方法只支持事件句柄在冒泡阶段执行

 

在使用时,需要兼容各个浏览器版本,下面进行函数封装

function addEvent(obj,type,func){     if(obj.addEventListener){         obj.addEventListener(type,func,false);//默认false可省略     }else{         obj.attachEvent("on"+type,func);     } }  function removeEvent(obj,type,func){     if(obj.removeEventListener){         obj.addEventListener(type,func,false);//默认false可省略     }else{         obj.detachEvent("on"+type,func);     } }

封装完毕,不过此方法只支持事件句柄在冒泡阶段执行