HTML DOM removeEventListener()Method

Examples

Remove the "mousemove" event added by the addEventListener() method:

// Add an event handler to the <div> element
document.getElementById("myDIV").addEventListener("mousemove", myFunction);

// Remove the event handler from the <div> element
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);

Try it Yourself »

Definition and Usage

The removeEventListener() method is used to remove theaddEventListener()event handler added by the method.

Note:If you want to remove an event handler, the function executed by addEventListener() must be an external function, as shown in the example above (myFunction).

Anonymous functions, like "document.removeEventListener("event", function(){ myScript});" The event cannot be removed.

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:Internet Explorer 8 and earlier IE versions do not support the removeEventListener() method, and Opera 7.0 and earlier versions of Opera also do not support it. However, for these browsers that do not support this function, you can usedetachEvent()method to remove an event handler added by the attachEvent() method (see "More Examples" for a cross-browser solution).

Syntax

element.removeEventListener(event, function, useCapture)

Parameter Values

Parameter	Description
event	Required. The name of the event to remove. Note:Do not use the "on" prefix. For example, use "click" instead of "onclick". Tip:For all HTML DOM events, you can view our completeHTML DOM Event Object Reference。
function	Required. Specifies the function to remove.
useCapture	Optional. A Boolean value that specifies the phase for removing the event handler. Possible values: true - Remove the event handler in the capture phase false - Default. Remove the event handler in the bubble phase Note:If you have added the event handler twice, once in the capture phase and once in the bubble phase, you must remove the event separately.

Technical Details

DOM Version:	DOM Level 2 events
Return Value:	No return value
Change Log:	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 IE versions
x.removeEventListener("mousemove", myFunction);
} else if (x.detachEvent) { // IE 8 and earlier IE versions
x.detachEvent("onmousemove", myFunction);
}

Try it Yourself »

JavaScript Tutorial:HTML DOM EventListener

JavaScript Reference:document.removeEventListener()

元素对象参考手册 Element Object

Other Extensions