A dispatchEvent metódus

A dispatchEvent metódus lehetővé teszi események szimulálását egy elemen. Miért hasznos: szimulálhatjuk a felhasználó gombnyomását, egy űrlap elküldését és így tovább. Az esemény nem fog különbözni az igazitól, kivéve a event.isTrusted tulajdonságot. Létre lehet még hozni nem szabványos (általad kitalált) nevű eseményeket is, majd meghívni őket a megfelelő pillanatban. A metódus arra az elemre vonatkozik, amelyen az eseményt meg szeretnénk hívni. A paraméterben a metódus egy eseményt (objektumot) kap, amely az Event konstruktorral jön létre.

Szintaxis

elem.dispatchEvent(esemeny);

Példa

Tegyük fel, van egy gombunk. A gomb megnyomásakor egy üzenet jelenik meg. Hozzuk azt létre, hogy amikor az egérmutató a gomb fölé ér, a gomb azt higgye, hogy rákattintottak:

<button id="button">gomb</button>

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

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

button.addEventListener('mouseover', function() {
	let clickEvent = new Event('click'); // esemény létrehozása
	this.dispatchEvent(clickEvent); // kattintás szimulálása a gombon
});

Példa

Létre lehet hozni saját eseményeket (saját névvel) és aztán a megfelelő pillanatban meghívni őket. Kössük a gombhoz a showMessage eseményt, és az egérmutató föléhúzásakor indítsuk el ezt az eseményt:

<button id="button">gomb</button>

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

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

button.addEventListener('mouseover', function() {
	let showMessageEvent = new Event('showMessage'); // esemény létrehozása
	this.dispatchEvent(showMessageEvent); // az esemény kiváltása
});