Sometimes, we want to stop propagation of mousedown or mouseup from a click handler with JavaScript.
In this article, we’ll look at how to stop propagation of mousedown or mouseup from a click handler with JavaScript.
How to stop propagation of mousedown or mouseup from a click handler with JavaScript?
To stop propagation of mousedown or mouseup from a click handler with JavaScript, we can call stopPropagation.
For instance, we write:
<div id="outer">
<div id="inner">
hello world
</div>
</div>
to add a inner div.
Then we write:
const inner = document.getElementById('inner')
inner.onmouseup = (e) => {
e.stopPropagation()
}
inner.onmousedown = (e) => {
e.stopPropagation()
}
to select the inner div with getElementById.
Then we set the onmouseup and onmousedown properties to a function that calls stopPropagation to stop propagation of the mouseup and mousedown events triggered by the div.
Conclusion
To stop propagation of mousedown or mouseup from a click handler with JavaScript, we can call stopPropagation.
