Τα κουμπιά στις ιστοσελίδες χρησιμοποιούνται για να παρέχουν διαδραστική εμπειρία χρήστη. Κατά κανόνα, εάν η απάντηση σε ένα κουμπί δεν απαιτεί αποστολή δεδομένων στον διακομιστή, τότε η αλληλεπίδραση πραγματοποιείται χρησιμοποιώντας σενάρια JavaScript. Οι μέθοδοι επίκλησης του αντίστοιχου κώδικα JavaScript ενδέχεται να διαφέρουν - παρακάτω είναι αρκετές πιθανές επιλογές για κουμπιά διαφορετικών τύπων.
Οδηγίες
Βήμα 1
Εάν η εμφάνιση ενός κουμπιού σε μια ιστοσελίδα οργανώνεται χρησιμοποιώντας την ετικέτα κουμπιού, τότε ο κώδικας JavaScript μπορεί να τοποθετηθεί στο χαρακτηριστικό onclick. Για παράδειγμα, όπως αυτό: κουμπί Φυσικά, δεν συνιστάται η τοποθέτηση αρκετά μεγάλου κώδικα απευθείας στην ετικέτα κουμπιού - είναι καλύτερα να το σχεδιάσετε ως συνάρτηση και να βάλετε μόνο τον κωδικό για την κλήση αυτής της λειτουργίας στο χαρακτηριστικό onclick. Για παράδειγμα:
function showAlert () {
ειδοποίηση ("Έγινε κλικ στο κουμπί!")
}
κουμπί
Βήμα 2
Εάν το κουμπί εμφανίζεται μέσω μίας από τις παραλλαγές της ετικέτας εισόδου (υποβολή, επαναφορά, κουμπί ή εικόνα), τότε μπορεί να χρησιμοποιηθεί το ίδιο χαρακτηριστικό onclick. Για παράδειγμα, για ένα κουμπί για εκκαθάριση πεδίων φόρμας (επαναφορά), ο κώδικας μπορεί να έχει την εξής μορφή: Εάν θέλετε να εκτελείται μόνο JavaScript όταν κάνετε κλικ στο κουμπί και δεν εμφανίζεται η προεπιλεγμένη ενέργεια, προσθέστε την εντολή επιστροφής λειτουργία ή απευθείας στο χαρακτηριστικό onclick false. Για παράδειγμα:
Βήμα 3
Εάν πρέπει να οργανώσετε μια απάντηση στο να κάνετε κλικ σε ένα κουμπί του τύπου υποβολής, τότε, εκτός από την παραπάνω μέθοδο χρησιμοποιώντας το χαρακτηριστικό onclick, μπορείτε να χρησιμοποιήσετε τις ιδιότητες της ετικέτας φόρμας στην οποία ανήκει αυτό το κουμπί. Η αντίστοιχη κλήση συνάρτησης μπορεί να τοποθετηθεί στο χαρακτηριστικό onsubmit της ετικέτας φόρμας. Για παράδειγμα:
Βήμα 4
Εάν το κουμπί δεν είναι στοιχείο φόρμας, αλλά απλώς ένα γραφικό στοιχείο (ετικέτα img), τότε τα πρότυπα για αυτό επιτρέπουν επίσης τη χρήση του χαρακτηριστικού onclick. Για παράδειγμα:
Βήμα 5
Εάν το κουμπί είναι υπερσύνδεσμος, τότε δεν πρέπει να χρησιμοποιείτε τα ίδια τα χαρακτηριστικά του κουμπιού · είναι καλύτερα να χρησιμοποιήσετε τις ιδιότητες της ετικέτας συνδέσμου. Μπορείτε, όπως και στις προηγούμενες επιλογές, να χρησιμοποιήσετε την ετικέτα onclick. Για παράδειγμα: Και μπορείτε να αντικαταστήσετε τη διεύθυνση στο χαρακτηριστικό href με μια κλήση συνάρτησης. Για παράδειγμα, όπως αυτό:
