HTML DOM removeEventListener() Method

Example

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: true - Removes the event handler from the capturing phase false- Default. Removes the event handler from the bubbling phase Note: If the event handler was attached two times, one with capturing and one bubbling, each must be removed separately.

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 »

JavaScript Tutorial: HTML DOM EventListener

JavaScript Reference: element.removeEventListener()

< Document Object