HTML DOM removeEventListener()
Method
Example
Remove the "mousemove" event added by the addEventListener()
method:
// Add event handler to <div> element
document.getElementById("myDIV").addEventListener("mousemove", myFunction);
// Remove event handler from <div> element
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);
Definition and Usage
The removeEventListener()
method removes event handlers that have been attached with the addEventListener()
method.
Note: To remove event handlers, the function specified with the addEventListener()
must be an external function, as shown in the example above (myFunction).
Anonymous functions, like document.removeEventListener("event", function(){ myScript });
cannot be removed.
Browser Support
The numbers in the table specify the first browser version that fully supports the method.
Method | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
removeEventListener() |
1.0 | 9.0 | 1.0 | 1.0 | 7.0 |
Note: removeEventListener()
method is not supported by Internet Explorer 8 and earlier versions, and Opera 7.0 and earlier. For these unsupported browsers, you can use the detachEvent()
method to remove event handlers added with attachEvent()
(see "More Examples" for a cross-browser solution).
Syntax
Parameter Values
Parameter | Description |
---|---|
event | Required. The name of the event to remove. <br> <br> Note: Do not use the "on" prefix. For example, use "click" instead of "onclick". <br> <br> Tip: For a complete list of all HTML DOM events, see our HTML DOM Event Object Reference |
function | Required. Specifies the function to remove. |
useCapture | Optional. A Boolean value that specifies the phase in which the event handler should be removed. <br> <br> Possible values: true - Removes the event handler during the capture phase. <br> false - Default. Removes the event handler during the bubbling phase. <br> Note: If an event handler is added twice, once for the capture phase and once for the bubbling phase, you must remove them separately. |
Technical Details
DOM Version: | DOM Level 2 events |
---|---|
Return Value: | No return value |
--- | --- |
Modification Record: | In Firefox 6 and Opera 12.0, the useCapture parameter is optional. (It has always been optional in Chrome, IE, and Safari). |
--- | --- |
More Examples
Example
If the browser does not support the removeEventListener()
method, you can use the detachEvent()
method instead.
This example demonstrates a cross-browser solution:
var x = document.getElementById("myDIV");
if (x.removeEventListener) { // All browsers, except IE 8 and earlier
x.removeEventListener("mousemove", myFunction);
} else if (x.detachEvent) { // IE 8 and earlier
x.detachEvent("onmousemove", myFunction);
}
Related Pages
JavaScript Tutorial: HTML DOM EventListener
JavaScript Reference: document.removeEventListener()