<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Cache-Control" content="no-cache" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<script type="text/javascript">
Obj = {
al: function(){
alert("aaaa");
}
}
function add(){
var btn = document.getElementById("aaa");
//btn.removeEventListener("click", Obj.al, false);
btn.addEventListener("click", Obj.al, false);
}
function addAnmonys(){
var btn = document.getElementById("aaa");
btn.addEventListener("click", function(){
alert("aaaa");
}, false);
}
function remove(){
var btn = document.getElementById("aaa");
btn.removeEventListener("click", Obj.al, false);
}
</script>
<title>New Web Project</title>
</head>
<body>
<input type="button" value="aaaaaa" id="aaa" />
<br/><br/>
<input type="button" value="执行一次add" onclick="add()"/>
<br/><br/>
<input type="button" value="执行一次addAnmonys" onclick="addAnmonys()"/>
<br/><br/>
<input type="button" value="执行一次remove" onclick="remove()"/>
</body>
</html>
当使用addEventListener绑定一个有名的监听函数时，不会被重复绑定（多次绑定也只会绑定一次），也可以去绑定。
使用匿名函数时，监听函数会被多次重复绑定，也无法去绑定。
分享到：
相关推荐
`addEventListener` 和 `removeEventListener` 是两个在现代浏览器中广泛使用的DOM（文档对象模型）API，它们允许我们向元素添加或移除事件处理函数，实现事件驱动的编程模式。然而，这些方法在Internet Explorer 8...
W3C 绑定方法是使用 addEventListener() 函数来绑定事件监听函数，这是一种更加标准化的绑定方法。 在选择绑定方法时，开发者需要考虑多个因素，例如浏览器兼容性、代码质量和开发效率。不同的绑定方法都有其优缺，...
所有的DOM节点中都包含这两种方法，并且它们都接受3个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。 最后这个布尔值参数是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用...
1. **`addEventListener`**: 当使用`addEventListener`添加事件监听器时，事件处理函数内的`this`会自动绑定到触发事件的元素。在提供的示例中，无论是点击`test1`还是`test2`，在Firefox和Chrome下，`this`始终指向...
移除事件监听器时，需要提供相同的参数：事件名、原始的事件处理函数和捕获标志。重要的是，如果当初添加事件监听器时使用的是匿名函数，由于JavaScript函数对象的特性，无法通过 `removeEventListener()` 移除，...
然而，在实践中，有时候我们会遇到一些挑战，比如如何有效地绑定和解除匿名函数作为事件处理器的问题。 #### 匿名函数绑定事件的挑战 匿名函数因其简洁性而在事件绑定中被广泛使用，但同时也带来了一些问题。最典型...
要移除事件句柄，addEventListener() 的执行函数必须使用外部函数，如上实例所示 (myFunction)。 匿名函数，类似 “document.removeEventListener(“event”, function(){ myScript });” 该事件是无法移除的。 而在...
addEventListener 方法用于绑定事件监听函数，参数包括 eventType、handler 和 useCapture。eventType 指定事件类型，handler 是事件处理函数，useCapture 是一个布尔值，用于指定是否在捕获阶段进行处理。 ...
在这个修复后的示例中，`handler`函数在`addEventListener()`和`removeEventListener()`中保持一致，因此能够正确地移除事件处理程序。 总结来说，`addEventListener()`和`removeEventListener()`是JavaScript事件...
在例子中，`球`对象被赋予了一个帧事件监听器，这意味着每当游戏引擎处理一帧时，都会触发绑定的函数（即`函数2`）。事件监听器通过`addEventListener`方法添加到对象上，而当不再需要时，可以通过`...
9. **事件处理**：JavaScript常用于处理用户与网页的交互，如`addEventListener`用于绑定事件监听器，`removeEventListener`用于解除绑定。 10. **DOM操作**：Document Object Model（DOM）允许JavaScript操作HTML...
- **动态绑定**：通过 JavaScript 为元素添加事件监听器，如 `element.addEventListener('click', function)` ##### 2. **触发事件的方法** 根据浏览器的不同，JavaScript 触发 HTML 元素绑定的函数有多种方法： ...
本文将详细介绍如何在不同的浏览器环境中（主要是 Mozilla 和 Internet Explorer）使用绑定与解绑函数，并通过实际代码示例进行演示。 #### 二、事件绑定 ##### 2.1 `addEventListener` 方法 (W3C 标准) **语法**...
1. 事件绑定：`addEventListener`和`removeEventListener`用于添加和移除事件监听器。 2. 事件对象：事件触发时，会返回一个事件对象，如`event.target`表示触发事件的元素，`event.preventDefault`阻止默认行为，`...
还有事件处理函数，如`addEventListener`和`removeEventListener`，用于绑定和解绑事件监听器。 在异步编程中，JavaScript提供了`setTimeout`和`setInterval`函数进行定时任务，以及`Promise`、`async/await`等用于...
现代事件绑定遵循W3C的DOM2级事件规范，它定义了`addEventListener`和`removeEventListener`两个方法，用于添加和删除事件处理程序。这种方式更加强大灵活，不会覆盖之前的事件处理函数，允许多个函数在同一个事件上...
在编程领域，回调函数是一种设计模式，它允许我们传递一个函数作为另一个函数的参数，以便在特定事件发生或特定操作完成后执行。在VC++（Microsoft Visual C++）中，回调函数是一个重要的特性，尤其在处理异步操作、...