Τα συμβάντα είναι ενέργειες ή περιστατικά που συμβαίνουν στο σύστημα. Στον κόσμο του προγραμματισμού, γεγονότα είναι κάτι που συμβαίνει στα στοιχεία HTML. Αλλά όταν χρησιμοποιείται σε σελίδες HTML, μπορεί να αντιδράσει σε αυτά τα γεγονότα. Σε αυτό το άρθρο, θα δούμε ποιοι είναι οι διαφορετικοί τύποι συμβάντων στο JavaScript και πώς λειτουργούν, με την ακόλουθη σειρά:
πώς λειτουργεί το tostring στην Ιάβα
Τι είναι τα συμβάντα σε JavaScript;
Η Javascript έχει συμβάντα που παρέχουν μια δυναμική διεπαφή σε μια ιστοσελίδα. Αυτά τα συμβάντα συνδέονται με στοιχεία στο Μοντέλο αντικειμένου εγγράφου (ΚΡΙΣΗ).
Επίσης, αυτά τα συμβάντα από προεπιλογή χρησιμοποιούν τη διάδοση φυσαλίδων, δηλαδή προς τα πάνω στο DOM από παιδιά σε γονέα. Μπορούμε να δεσμεύσουμε συμβάντα είτε ως ενσωματωμένα είτε σε εξωτερικό σενάριο. Με τη βοήθεια του JavaScript, μπορείτε να εντοπίσετε πότε συμβαίνουν συγκεκριμένα συμβάντα και να προκαλέσετε πράγματα που συμβαίνουν ως απάντηση σε αυτά τα συμβάντα.
Τύποι εκδηλώσεων σε JavaScript
Υπάρχουν διάφοροι τύποι εκδηλώσεων στο που χρησιμοποιούνται για την αντίδραση σε γεγονότα. Εδώ, θα συζητήσουμε μερικά από τα διάσημα ή πιο συχνά χρησιμοποιούμενα γεγονότα όπως:
- Στο κλικ
- Ενεργοποίηση
- Onmouseover
- Φόρτωση
- Εστίαση
Ας προχωρήσουμε λοιπόν και ρίξτε μια ματιά σε αυτά τα συμβάντα σε JavaScript με παράδειγμα.
Εκδήλωση Onclick
Το συμβάν Onclick είναι ένα συμβάν ποντικιού και προκαλεί οποιαδήποτε λογική ορίζεται εάν ο χρήστης κάνει κλικ στο στοιχείο στο οποίο δεσμεύεται. Ας πάρουμε ένα παράδειγμα και να δούμε πώς λειτουργεί:
function edu () {alert ('Welcome to Edureka!')} Κάντε κλικ στο κουμπίΠαραγωγή:
Αφού κάνετε κλικ στο κουμπί, λαμβάνετε το ακόλουθο μήνυμα ειδοποίησης:
Εκδήλωση Onekeyup
Αυτό το συμβάν είναι ένα συμβάν πληκτρολογίου και χρησιμοποιείται για την εκτέλεση οδηγιών κάθε φορά που απελευθερώνεται ένα πλήκτρο μετά το πάτημα. Το παρακάτω παράδειγμα δείχνει τη λειτουργία της εκδήλωσης:
var a = 0 var b = 0 var c = 0 function functionBackground () {var x = document.getElementById ('bg') bg.style.backgroundColor = 'rgb (' + a + ',' + b + ',' + c + ')' a + = 1 b + = a + 1 c + = b + 1 εάν (a> 255) a = a - b εάν (b> 255) b = a εάν (c> 255) c = b}Παραγωγή:
Αφού γράψετε κάτι, μοιάζει με αυτό:
Εκδήλωση Onmouseover
Το συμβάν onmouseover στο JavaScript αντιστοιχεί στο να τοποθετήσετε το δείκτη του ποντικιού πάνω από το στοιχείο και τα παιδιά του, στο οποίο δεσμεύεται. Το παράδειγμα φαίνεται παρακάτω:
συνάρτηση hov () {var e = document.getElementById ('hover') e.style.display = 'none'}Παραγωγή:
Το χρωματιστό κουτί εμφανίζεται πριν αιωρήσετε το ποντίκι. Μόλις τοποθετήσετε το ποντίκι πάνω από το κουτί, εξαφανίζεται.
Εκδήλωση φόρτωσης
Το γεγονός φόρτωσης προκαλείται όταν ένα στοιχείο φορτώνεται πλήρως. Ας πάρουμε ένα παράδειγμα και να δούμε πώς λειτουργεί:
Παραγωγή:
Εκδήλωση Onfocus
Το συμβάν Onfocus έχει μια λίστα στοιχείων που εκτελεί οδηγίες όποτε λαμβάνει εστίαση. Το παρακάτω παράδειγμα δείχνει πώς λειτουργεί το συμβάν onfocus:
εστιασμένη συνάρτηση () {var e = document.getElementById ('input') if (επιβεβαίωση ('Focus Event')) {e.blur ()}}Εστίαση στο πλαίσιο εισαγωγής:
Παραγωγή:
Αυτά είναι μερικά από τα πιο συχνά χρησιμοποιούμενα συμβάντα στο JavaScript. Με αυτό, φτάσαμε στο τέλος του άρθρου μας. Ελπίζω να καταλάβατε τι είναι τα γεγονότα και πώς χρησιμοποιούνται.
Ρίξτε μια ματιά στο δικό μας που έρχεται με ζωντανή εκπαίδευση με καθοδήγηση εκπαιδευτή και πραγματική εμπειρία έργου. Αυτή η εκπαίδευση σας κάνει ικανό σε δεξιότητες για να εργαστείτε με τεχνολογίες ιστού back-end και front-end. Περιλαμβάνει εκπαίδευση σε Web Development, jQuery, Angular, NodeJS, ExpressJS και MongoDB.
Έχετε μια ερώτηση για εμάς; Παρακαλώ αναφέρετέ το στην ενότητα σχολίων αυτού του ιστολογίου και θα επικοινωνήσουμε μαζί σας.