Իվենթների բաբլյուկի դադարեցումը JavaScript-ում

Իվենթի բաբլյուկը կարելի է դադարեցնել ցանկացած էլեմենտի վրա, որի միջով անցնում է իվենթը: Դրա համար անհրաժեշտ է էլեմենտի կոդում կանչել Event օբյեկտի stopPropagation մեթոդը:

Հաջորդ օրինակում կարմիր բլոկի վրա կլիկը կգործարկվի հենց դրա վրա, ապա կապույտ բլոկի վրա և ավարտ՝ կապույտ բլոկը դադարեցնում է հետագա բաբլյուկը, և կանաչ բլոկը այլևս չի արձագանքի.

javascriptelem1.addEventListener('click', function() {
  console.log('կանաչ');
});
elem2.addEventListener('click', function(event) {
  console.log('կապույտ');
  event.stopPropagation(); // դադարեցնում ենք բաբլյուկը
});
elem3.addEventListener('click', function() {
  console.log('կարմիր');
});

Կարող եք ստուգել.