Metóda dispatchEvent

Metóda dispatchEvent umožňuje simulovať udalosť na prvku. Načo to je potrebné: je možné simulovať stlačenie tlačidla používateľom, pokus o odoslanie formulára a podobne. Pritom sa udalosť nebude líšiť od skutočnej ničím okrem vlastnosti event.isTrusted. Je možné dokonca vytvoriť udalosti s neštandardnými (vami vymyslenými) názvami a potom ich volať v potrebnom momente. Metóda sa aplikuje na prvok, na ktorom je potrebné vyvolať udalosť. V parametri metóda prijíma udalosť (objekt), vytvorenú pomocou konštruktora new Event.

Syntax

javascriptprvok.dispatchEvent(udalost);

Príklad

Majme tlačidlo. Pri kliknutí na toto tlačidlo sa zobrazí správa. Urobme to tak, aby pri nadbehnutí myšou na tlačidlo sa toto tlačidlo domnievalo, že naň bolo kliknuté:

html<button id="button">tlačidlo</button>

javascriptlet button = document.querySelector('#button');

button.addEventListener('click', function() {
  alert('správa');
});

button.addEventListener('mouseover', function() {
  let clickEvent = new Event('click'); // vytvoríme udalosť
  this.dispatchEvent(clickEvent); // simulujeme kliknutie na tlačidlo
});

Результат:

Príklad

Je možné vytvoriť vlastné udalosti (s vlastným názvom) a potom ich v potrebnom momente vyvolať. Naviažme na tlačidlo udalosť showMessage a pri nadbehnutí myšou inicializujme túto udalosť:

html<button id="button">tlačidlo</button>

javascriptlet button = document.querySelector('#button');

button.addEventListener('showMessage', function() {
  alert('správa');
});

button.addEventListener('mouseover', function() {
  let showMessageEvent = new Event('showMessage'); // vytvoríme udalosť
  this.dispatchEvent(showMessageEvent); // vyvoláme spustenie udalosti
});

Результат: