Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

จะลบตัวจัดการเหตุการณ์ใน JavaScript ได้อย่างไร


Javascript ให้ removeEventListener() วิธีการลบ ตัวจัดการเหตุการณ์ . เหตุการณ์ได้รับการจัดการผ่าน addEvenetListener() กระบวนการ. removeEventListener() วิธีลบตัวจัดการเหตุการณ์ที่แนบกับ addEventListener() วิธีการ

ตัวอย่าง

<html>
<body>
   <h3 id="add">Hover me </h3>
   <p id="remove"> </p>
   <h3>Click this button to stop hovering effect </h3>
   <input type ="button" id="clickIt" onclick="RespondClick()" value ="remove">
   <script>
      const listener = document.getElementById("add");
      listener.addEventListener("mouseover", RespondMouseOver);
      function RespondMouseOver() {
         document.getElementById("remove").innerHTML += 1+ "</br>";
      }
      function RespondClick() {
         listener.removeEventListener("mouseover", RespondMouseOver);
         document.getElementById("remove").innerHTML += 0;
      }
      </script>
</body>
</html>

เมื่อเรารันโค้ดข้างต้น เราจะแสดงสิ่งต่อไปนี้บนหน้าจอ

จะลบตัวจัดการเหตุการณ์ใน JavaScript ได้อย่างไร

หากเราวางเมาส์เหนือข้อความ "วางเมาส์เหนือฉัน" เลข 1 จะปรากฏขึ้น จำนวนครั้งที่เราโฮเวอร์ จำนวนครั้งที่เกิด 1 ครั้ง เมื่อเราวางข้อความไว้ 4 ครั้ง เราจะได้รับสิ่งต่อไปนี้บนหน้าจอ

ผลลัพธ์

จะลบตัวจัดการเหตุการณ์ใน JavaScript ได้อย่างไร

To stop the event handler, we have to click on the "remove" button. After clicking on the remove button we get '0' displayed on the screen and later on even though we hover on the text no 1's will be produced as shown in the figure.

จะลบตัวจัดการเหตุการณ์ใน JavaScript ได้อย่างไร