JavaScript removeEventListener() विधि का उपयोग किसी ईवेंट श्रोता को उस तत्व से निकालने के लिए किया जाता है जिसे पहले addEventListener() विधि से जोड़ा गया है।
removeEventListener() विधि के लिए कोड निम्नलिखित है -
उदाहरण
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.sample{
font-size: 18px;
font-weight: 500;
color:red;
}
</style>
</head>
<body>
<h1>JavaScript removeEventListener() method</h1>
<div class="sample"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click on the above button to print a number
</h3>
<button class="Btn">Remove event Listener</button>
<h3>Click on the above button to remove the event listener of the first button</h3>
<script>
let sampleEle = document.querySelector('.sample');
let j=0;
function printNum(){
sampleEle.innerHTML += 'Number = ' + j++ + '<br>';
}
document.querySelector('.Btn').addEventListener('click',printNum);
document.querySelectorAll('.Btn')[1].addEventListener('click',()=>{
document.querySelector('.Btn').removeEventListener('click',printNum);
sampleEle.innerHTML = 'Event listener has been removed';
})
</script>
</body>
</html> आउटपुट
उपरोक्त कोड निम्न आउटपुट देगा -
तीन बार 'यहां क्लिक करें' पर क्लिक करने पर -
'इवेंट श्रोता हटाएं' बटन पर क्लिक करने और 'यहां क्लिक करें' बटन पर फिर से क्लिक करने पर -
