/Html/Stopimmediatepropagation vs stoppropagation

Stopimmediatepropagation vs stoppropagation

<!---- stopImmediatePropagation() vs stopPropagation() ----------------->

`stopPropagation` allows other event handlers on the SAME ELEMENT 
on the SAME EVENT to be executed, while `stopImmediatePropagation`
prevents this.

<script>
el.addEventListener( "click", e => e.stopImmediatePropagation() )
el.addEventListener( "click", e => console.log("This will not run.") )
</script>

<!----------------- stopImmediatePropagation() vs stopPropagation() ---->

<!-- index.html -->

<div id="credit">Procrastination for Dummies</div> 
Copy code
JAVASCRIPT
/* script.js */

const credit = document.querySelector("#credit");

credit.addEventListener("click", function(event) {
  console.log("Nah, I'll do it later");
});

credit.addEventListener("click", function(event) {
  console.log("I WILL do it tomorrow");
  event.stopImmediatePropagation();
});

credit.addEventListener("click", function(event) {
  console.log("Why do I have so much work piled up?!");
});

/* Clicking on the div block will print to the console:

  Nah, I'll do it later
  I WILL do it tomorrow

*/

Source: practicum.yandex.com

Similar codes

26 votes126 views5 answers
How to change font colour in html
Html
0 vote135 views2 answers
How to stop audio when playing other in html
Html
14 votes146 views5 answers
Pattern email validation
Html
17 votes135 views3 answers
Required option for select tag
Html
0 vote133 views2 answers
How to give value to model from radio button html asp with enums if checked
Html
1 vote126 views1 answer
Filled input in form
Html
35 votes98 views1 answer
Html img width
Html
0 vote127 views1 answer
Zk wrap listbox in horizontal scrollbar
Html
2 votes134 views1 answer
Show pdf in html
Html
5 votes135 views1 answer
Text bold in .md file
Html