Η εντολή new Event

Η εντολή new Event - κατασκευαστής γεγονότων, με τη βοήθεια του οποίου μπορείτε να δημιουργήσετε ένα αντικείμενο γεγονότος, και στη συνέχεια να ενεργοποιήσετε αυτό το γεγονός από τη JavaScript με τη μέθοδο dispatchEvent. Γιατί αυτό είναι απαραίτητο: μπορείτε να προσομοιώσετε το πάτημα του χρήστη σε ένα κουμπί, την προσπάθεια αποστολής μιας φόρμας και ούτω καθεξής. Σε αυτή την περίπτωση, το γεγονός δεν θα διαφέρει από το πραγματικό σε τίποτα εκτός από την ιδιότητα event.isTrusted. Μπορείτε ακόμη και να δημιουργήσετε γεγονότα με μη τυπικά (από εσάς εφευρεθέντα) ονόματα και στη συνέχεια να τα ενεργοποιήσετε την κατάλληλη στιγμή.

Σύνταξη

new 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); // προκαλούμε την ενεργοποίηση του γεγονότος
});

Δείτε επίσης

η ιδιότητα addEventListener,
που συνδέει γεγονότα
η ιδιότητα removeEventListener,
που αποσυνδέει γεγονότα