Σαν HTML Γεγονός εννοούμε μια ενέργεια που κάνει ο χρήστης κατά την διάρκεια της παραμονής του στην ιστοσελίδα μας. Τέτοιες ενέργειες είναι όπως το άνοιγμα (on load) και το κλείσιμο (on unload) ενός εγγράφου, η μετακίνηση του δείκτη του ποντικιού πάνω από (on mouse over) μια εικόνα ή ένα κελί ενός πίνακα, το πάτημα του αριστερού κουμπιού του ποντικιού (on click) επάνω σε ένα στοιχείο της σελίδας μας, η επιλογή ενός στοιχείου μιας Φόρμας (on blur) κτλ.
Χειριστές Γεγονότων
Χειριστές Γεγονότων είναι ιδιότητες των ετικετών που ελέγχουν αν γίνεται κάποια συγκεκριμένη κίνηση πάνω στα στοιχεία που ορίζουν αυτές οι ιδιότητες. Μια τέτοια ιδιότητα είναι η onmouseover (on mouse over) η οποία ελέγχει αν ο δείκτης του ποντικιού του χρήστη περάσει επάνω από το στοιχείο της σελίδας μας.
Όταν πραγματοποιείτε ένα τέτοιο Γεγονός, τότε ενεργοποιείται μια λειτουργία από ένα script γραμμένο σε JavaScript ή σε VBScript ή σε κάποια άλλη γλώσσα script. Το όνομα αυτής της λειτουργίας μπαίνει σαν τιμή στον χειριστή Γεγονότος. Για παράδειγμα αν θέλω κάθε φορά που ο δείκτης του ποντικιού του χρήστη να περνάει πάνω από μια συγκεκριμένη εικόνα να εκτελείτε η JavaScript λειτουργία με όνομα leitourgia1(), τότε θα έγραφα:
Χειριστές γεγονότων μπορούμε να πρόσθέσουμε σχεδόν σε όλα τα HTML στοιχεία (πίνακας, γραμμή ενός πίνακα, κελί ενός πίνακα, σύνδεσμος, στοιχείο φόρμας, παράγραφο κτλ.)
Τα script συνήθως γράφονται στην ενότητα HEAD της σελίδας μέσα στις ετικέτες:
<script >
...
</script >
//
Ένα παράδειγμα script γραμμένο σε Javascript είναι το παρακάτω:
Φυσικά δεν μπορούμε να παρουσιάσουμε την γλώσσα JavaScript σε αυτό το σημείο. Αυτό που θα παρουσιάσουμε είναι οι χειριστές Γεγονότων της HTML :
Όταν πραγματοποιείτε ένα τέτοιο Γεγονός, τότε ενεργοποιείται μια λειτουργία από ένα script γραμμένο σε JavaScript ή σε VBScript ή σε κάποια άλλη γλώσσα script. Το όνομα αυτής της λειτουργίας μπαίνει σαν τιμή στον χειριστή Γεγονότος. Για παράδειγμα αν θέλω κάθε φορά που ο δείκτης του ποντικιού του χρήστη να περνάει πάνω από μια συγκεκριμένη εικόνα να εκτελείτε η JavaScript λειτουργία με όνομα leitourgia1(), τότε θα έγραφα:
<img src="/papagalos.jpg" onmouseover="leitourgia1()" />
Τα script συνήθως γράφονται στην ενότητα HEAD της σελίδας μέσα στις ετικέτες:
<script >
...
</script >
//
Ένα παράδειγμα script γραμμένο σε Javascript είναι το παρακάτω:
<script language="Javascript" >
< !--
function leitourgia1 () {
var temp = 0
document.form1.pedio.value = 10
} //-- >
</script>
< !--
function leitourgia1 () {
var temp = 0
document.form1.pedio.value = 10
} //-- >
</script>
| Χειριστής Γεγονότος | Τιμή | Περιγραφή |
|---|---|---|
| onblur | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο δείκτης του ποντικιού απομακρύνεται από ένα στοιχείο μιας φόρμας της σελίδας (μόνο για HTML φόρμες) |
| onchange | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης αλλάζει την τιμή ενός στοιχείου μιας φόρμας (μόνο για HTML φόρμες) |
| onclick | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης πατάει επάνω σε ένα στοιχείο της σελίδας |
| onfocus | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης εστιάζει σε ένα στοιχείο της σελίδας |
| onload | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν η σελίδα φορτωθεί στον web browser (μόνο για τις ετικέτες και ) |
| onmouseover | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης περάσει τον δείκτη του ποντικιού του επάνω από ένα στοιχείο της σελίδας |
| onselect | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης επιλέγει μια τιμή από μια λίστα επιλογών μιας φόρμας (μόνο για HTML φόρμες) |
| onsubmit | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης υποβάλει μια φόρμα (μόνο για HTML φόρμες) |
| onunload | όνομα λειτουργίας | Εκτελεί μια λειτουργία όταν ο χρήστης μεταφερθεί σε άλλη διεύθυνση στο WEB, όταν φύγει δηλαδή από την ιστοσελίδα μας (μόνο για τις ετικέτες και ) |
Μπορείτε επίσης να δείτε τα HTML Events που μπορούν να πάρουν οι ετικέτες της HTML5
