HTML DOM removeEventListener()用法及代碼示例

removeEventListener()方法用於刪除與addEventListener()方法關聯的事件處理程序。此刪除事件處理程序的方法隻能與使用外部函數指定的addEventListener()方法一起使用。

用法:

element.removeEventListener(event, function, useCapture);

參數：此函數接受三個參數，如下所述：

event：參數event指定要刪除的事件的名稱。
function：參數函數指定要刪除的函數。
useCapture：參數useCapture表示要從事件處理程序中刪除的事件階段。如果useCapture的布爾值為true，則將其從捕獲階段中刪除事件處理程序，否則將其從冒泡階段中刪除事件處理程序。

例：在下麵的示例中，調用事件處理程序，該事件處理程序在鼠標移動到除法上時更改除法標記的顏色。按下更改顏色按鈕後，與除法標記關聯的事件處理程序將被刪除，並且將鼠標移到除法上時不會出現顏色變化。

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
        #myDIV { 
            font-size:60px; 
            border:1px solid; 
            padding:50x; 
            color:black; 
        } 
    </style> 
</head> 
  
<body> 
    <div id="myDIV"> 
        GeeksForGeeks 
    <br> 
          
        <button onclick="removeHandler()" id="myBtn"> 
            Change color 
        </button> 
    </div> 
      
    <script> 
        document.getElementById("myDIV") 
            .addEventListener("mousemove", myFunction); 
          
        function myFunction() { 
            document.getElementById("myDIV") 
                        .style.color= "green"; 
        } 
          
        function removeHandler() { 
            document.getElementById("myDIV") 
            .removeEventListener("mousemove", myFunction); 
        } 
    </script> 
</body> 
</html>

輸出：
按下按鈕之前：

按下按鈕後：

支持的瀏覽器：removeEventListener()方法支持的瀏覽器如下：

穀歌瀏覽器1.0
Internet Explorer 9.0
Firefox 1.0
Opera 7.0
Safari 1.0

相關用法

注：本文由純淨天空篩選整理自chaitanyashah707大神的英文原創作品 HTML | DOM removeEventListener() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。