HTML DOM removeEventListener() Method
Document ObjectExample
Remove a "mousemove" event that has been attached with the addEventListener() method:
// Attach an event handler to the document
document.addEventListener("mousemove",
myFunction);
// Remove the event handler from the document
document.removeEventListener("mousemove", myFunction);
Try it yourself »
More "Try it Yourself" examples below.
Definition and Usage
The document.removeEventListener() method removes an event handler that has been attached with the document.addEventListener() method.
Note: To remove event handlers, the function specified with the addEventListener() method must be an external, "named" function, like in the example above (myFunction).
Anonymous functions, like "document.removeEventListener("event", function(){ myScript });" will not work.
Tip: Use the element.addEventListener() and element.removeEventListener() methods to add/remove event handlers to/from a specified element.
Browser Support
The numbers in the table specify the first browser version that fully supports the method.
| Method | |||||
|---|---|---|---|---|---|
| removeEventListener() | 1.0 | 9.0 | 1.0 | 1.0 | 7.0 |
Note: The removeEventListener() method is not supported in Internet Explorer 8 and earlier versions, and Opera 6.0 and earlier versions. However, for these specific browser versions, you can use the detachEvent() method to remove event handlers that have been attached with the attachEvent() method (see "More Examples" below for a cross-browser solution).
Syntax
document.removeEventListener(event, function,
useCapture)
Parameter Values
| Parameter | Description |
|---|---|
| event | Required. A String that specifies the name of the event to remove. Note: Do not use the "on" prefix. For example, use "click" instead of "onclick". Tip: For a list of all HTML DOM events, look at our complete HTML DOM Event Object Reference. |
| function | Required. Specifies the function to remove. |
| useCapture |
Optional. A Boolean value that specifies the event phase
to remove the event handler from. Possible values:
|
Technical Details
| DOM Version: | DOM Level 2 events |
|---|---|
| Return Value: | No return value |
| Changelog: | The useCapture parameter became optional in Firefox 6 and Opera 12.0 (has always been optional for Chrome, IE and Safari) |
More Examples
Example
For browsers that do not support the removeEventListener() method, you can use the detachEvent() method.
This example demonstrates a cross-browser solution:
if (document.removeEventListener) { // For all major browsers, except IE 8 and earlier
document.removeEventListener("mousemove", myFunction);
} else if (document.detachEvent) { // For IE 8 and earlier versions
document.detachEvent("onmousemove", myFunction);
}
Try it Yourself »
Related Pages
JavaScript Tutorial: HTML DOM EventListener
JavaScript Reference: element.removeEventListener()
