HTML DOM removeEventListener()メソッド

例

addEventListener() メソッドで追加された "mousemove" イベントを削除します:

// <div> 要素にイベントハンドラーを追加
document.getElementById("myDIV").addEventListener("mousemove", myFunction);

// <div> 要素のイベントハンドラーを削除
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);

試してみる »

定義と使い方

removeEventListener() メソッドは、addEventListener()メソッドによって追加されたイベントハンドラーを削除するために使用されます。

注意:イベントハンドラーを削除するには、addEventListener() の実行関数は、上記の例 (myFunction) のように外部関数を使用する必要があります。

匿名関数、例えば "document.removeEventListener("event", function(){ myScript});" このイベントは削除できません。

ブラウザサポート

表内の数字は、そのメソッドをサポートする最初のブラウザバージョンを示しています。

メソッド
removeEventListener()	1.0	9.0	1.0	1.0	7.0

注意:Internet Explorer 8 およびそれ以前の IE バージョンは removeEventListener() メソッドをサポートしておらず、Opera 7.0 およびそれ以前の Opera バージョンもサポートしていません。ただし、これらの関数をサポートしないブラウザでは、次のメソッドを使用できます。detachEvent()メソッドを使用して、attachEvent() メソッドによって追加されたイベントハンドラーを削除します（クロスブラウザーの解決策については「その他の例」を参照してください）。

構文

element.removeEventListener(event, function, useCapture)

パラメータ値

Parameter	Description
event	必須。削除するイベント名。注意:"on" プレフィックスを使用しないでください。たとえば、"onclick" ではなく "click" を使用します。ヒント:すべての HTML DOM イベントについては、完全なHTML DOM Event オブジェクトリファレンスマニュアル。
function	必須。削除する関数を指定します。
useCapture	オプション。イベントハンドラーを削除するフェーズを指定するブール値。可能な値: true - キャプチャフェーズでイベントハンドラーを削除 false - デフォルト。バブリングフェーズでイベントハンドラーを削除注意:イベントハンドラーを2回追加した場合（1回はキャプチャフェーズ、もう1回はバブリングフェーズ）、そのイベントを個別に削除する必要があります。

技術的な詳細

DOM バージョン:	DOM Level 2 events
戻り値:	戻り値なし
変更履歴:	Firefox 6 と Opera 12.0 では、useCapture パラメータはオプションです。（Chrome、IE、Safari では常にオプションでした）。

その他の例

例

ブラウザが removeEventListener() メソッドをサポートしていない場合は、detachEvent() メソッドを使用できます。

この例は、クロスブラウザーの解決策を示しています：

var x = document.getElementById("myDIV");
if (x.removeEventListener) { // // すべてのブラウザ、IE 8 およびそれ以前の IE バージョンを除く
x.removeEventListener("mousemove", myFunction);
} else if (x.detachEvent) { // IE 8 およびそれ以前の IE バージョン
x.detachEvent("onmousemove", myFunction);
}

試してみる »

JavaScriptオブジェクト

Browserオブジェクト

DOMオブジェクト

HTML オブジェクト