JS

您所在的位置：网站首页 › js销毁dom › JS

JS

2023-10-16 07:31| 来源: 网络整理| 查看: 265

注册事件

在DOM事件模型中，通过调用对象的addEventListener()方法注册事件，用法如下：

element.addEventListener(String type, Function listener, boolean useCapture); type：注册事件的类型名。事件类型与事件属性不同，事件类型名没有on前缀。例如，对于事件属性为onclick来说，所对应的事件类型应为click。listener：监听函数，即事件处理函数。在指定类型的事件发生时将调用该函数。在调用这个函数时，默认传递给它的唯一参数是event对象。useCapture：是一个布尔值。如果为true，则指定的事件处理函数将在事件传播的捕获阶段触发；如果为false，则事件处理函数将在冒泡阶段触发。

示例：使用addEventListener()方法为所有按钮注册click事件。

按钮1 按钮2 var btn = document.getElementsByTagName("button"); for(var i in btn){ btn[i].addEventListener("click", function(){ alert(this.innerHTML); }, true); }

使用addEventListener()方法能够为多个对象注册相同的事件处理函数，也可以为同一个对象注册多个事件处理函数。

示例：为段落p注册两个事件

为对象注册多个事件 var p1 = document.getElementById("p1"); p1.addEventListener("mouseover", function(){ this.style.background = 'blue'; }, true); p2.addEventListener("mouseover", function(){ this.style.background = 'red'; }, true); 销毁事件

在DOM事件模型中，使用removeEventListener()方法可以从指定对象中删除已经注册的事件处理函数。

element.removeEventListener(String type, Function listener, boolean useCapture);

参数与addEventListener()方法相同。

示例：分别为按钮a和b注册单击事件，b的事件函数为删除a的事件

var a = document.getElementById("a"); var b = document.getElementById("b"); function ok(){ alert("你好!"); } function delete_event(){ a.removeEventListener("click", ok, false); } a.addEventListener("click", ok, false); b.addEventListener("click", delete_event, false);

注意： \color{red}{注意：} 注意：removeEventListener()方法只能删除addEventListener()注册的事件。如果直接使用onclick等直接写在元素上的事件，将无法使用removeEventListener()方法删除!

【本文地址】

JS

JS

今日新闻

推荐新闻