Методот dispatchEvent

Методот dispatchEvent овозможува симулирање на настан на елемент. Зошто ова е потребно: може да се симулира притискање на корисникот на копче, обид за испраќање на форма и така натаму. Притоа настанот нема да се разликува од вистинскиот по ништо освен по својството event.isTrusted. Може дури и да се креираат настани со нестандардни (од вас измислени) имиња и потоа да се повикуваат во потребен момент. Методот се применува на елементот на кој треба да се повика настанот. Како параметар методот добива настан (објект), креиран со помош на конструкторот new Event.

Синтакса

element.dispatchEvent(event);

Пример

Да претпоставиме дека имаме копче. При притискање на ова копче се прикажува порака. Ајде да направиме така што при преминување со глушецот врз копчето ова копче да мисли дека е кликнато врз него:

<button id="button">копче</button>

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

button.addEventListener('click', function() {
	alert('порака');
});

button.addEventListener('mouseover', function() {
	let clickEvent = new Event('click'); // креираме настан
	this.dispatchEvent(clickEvent); // симулираме кликнување на копчето
});

Пример

Може да се креираат сопствени настани (со сопствено име) и потоа во потребен момент да се повикуваат. Ајде да го поврземе на копчето настанот showMessage и при преминување со глушецот да го иницираме овој настан:

<button id="button">копче</button>

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

button.addEventListener('showMessage', function() {
	alert('порака');
});

button.addEventListener('mouseover', function() {
	let showMessageEvent = new Event('showMessage'); // креираме настан
	this.dispatchEvent(showMessageEvent); // го активираме настанот
});