Issue
I have a button with id "myButton" when clicked it should increase the count in span with id "clickCount" by 1 every time, the other button has an id "deactivate", when clicked it should no longer allow the increase in count even if the button with id "myButton" is clicked, I can manage upto the increase in count, but don't know how to stop the count from increasing without disabling the first button.
HTML
<button id="myButton">Click me!</button>
<p>You clicked on the button <span id="clickCount">0</span> times</p>
<button id="deactivate">Désactivate counting</button>
Javascript
let myButton = document.getElementById('myButton');
let newCount = document.getElementById('clickCount');
let deact = document.getElementById('deactivate');
let count = 0;
myButton.addEventListener("click", function() {
count++;
newCount.innerText = count;
});
Solution
Remove the event listener from #myButton
when the other button is clicked
let myButton = document.getElementById('myButton');
let newCount = document.getElementById('clickCount');
let deact = document.getElementById('deactivate');
let count = 0;
function handler() {
count++;
newCount.innerText = count;
}
myButton.addEventListener('click', handler);
deact.addEventListener('click', () => myButton.removeEventListener('click', handler));
<button id="myButton">Click me!</button>
<p>You clicked on the button <span id="clickCount">0</span> times</p>
<button id="deactivate">Désactivate counting</button>
Answered By - CertainPerformance Answer Checked By - Dawn Plyler (PHPFixing Volunteer)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.