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

element.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å:

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

let 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:

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

let 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
});