Metoden dispatchEvent

Metoden dispatchEvent lar deg imitere en hendelse på et element. Hvorfor dette er nyttig: du kan imitere et brukerklikk på en knapp, et forsøk på å sende inn et skjema og så videre. I tillegg vil ikke hendelsen kunne skilles fra en ekte hendelse på noen annen måte enn gjennom egenskapen event.isTrusted. Du kan til og med opprette hendelser med ikke-standard (selvoppfunnet) navn og deretter utløse dem i riktig øyeblikk. Metoden brukes på elementet som hendelsen skal utløses på. I parameteren tar metoden en hendelse (et objekt), opprettet med konstruktøren new Event.

Syntaks

javascriptelement.dispatchEvent(event);

Eksempel

La oss si vi har en knapp. Når du klikker på denne knappen vises en melding. La oss gjøre slik at når musepekeren beveger seg over knappen, skal knappen tro at den ble klikket på:

html<button id="button">knapp</button>

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

button.addEventListener('click', function() {
  alert('melding');
});

button.addEventListener('mouseover', function() {
  let clickEvent = new Event('click'); // oppretter en hendelse
  this.dispatchEvent(clickEvent); // imiterer et klikk på knappen
});

Результат:

Eksempel

Du kan opprette dine egne hendelser (med ditt eget navn) og deretter utløse dem i riktig øyeblikk. La oss knytte en hendelse kalt showMessage til knappen og utløse denne hendelsen når musepekeren beveger seg over:

html<button id="button">knapp</button>

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

button.addEventListener('showMessage', function() {
  alert('melding');
});

button.addEventListener('mouseover', function() {
  let showMessageEvent = new Event('showMessage'); // oppretter en hendelse
  this.dispatchEvent(showMessageEvent); // utløser hendelsen
});

Результат: