Χρησιμοποιώντας την ετικέτα εισόδου για την υποβολή εντύπων
Οι φόρμες HTML είναι ένας από τους πιο βασικούς τρόπους για να προσθέσετε την αλληλεπίδραση στον ιστότοπό σας. Μπορείτε να κάνετε ερωτήσεις και να ζητάτε απαντήσεις από τους αναγνώστες σας, να παρέχετε πρόσθετες πληροφορίες από βάσεις δεδομένων, να δημιουργείτε παιχνίδια και πολλά άλλα. Υπάρχουν ορισμένα στοιχεία HTML που μπορείτε να χρησιμοποιήσετε για να δημιουργήσετε τις φόρμες σας. Και μόλις δημιουργήσετε τη φόρμα σας, υπάρχουν πολλοί διαφορετικοί τρόποι υποβολής των δεδομένων στον διακομιστή ή απλώς εκκίνησης της ενέργειας φόρμας που εκτελείται.
Αυτοί είναι διάφοροι τρόποι υποβολής των εντύπων σας:
-
- Αυτή είναι η πιο κοινή μέθοδος λήψης δεδομένων στον διακομιστή, αλλά μπορεί να είναι πολύ απλή.
-
- Χρησιμοποιώντας μια εικόνα καθίσταται πολύ εύκολο να κάνετε το κουμπί υποβολής σας να ταιριάζει με το στυλ του ιστότοπού σας. Αλλά μερικοί άνθρωποι μπορεί να μην το αναγνωρίζουν ως κουμπί υποβολής.
-
- Η ετικέτα ΕΙΣΑΓΩΓΗ κουμπιού δίνει πολλές από τις ίδιες επιλογές με την ετικέτα ΕΙΣΑΓΩΓΗ εικόνας, αλλά μοιάζει περισσότερο με τον τυπικό τύπο υποβολής. Απαιτεί JavaScript για ενεργοποίηση.
- <κουμπί>
- Η ετικέτα BUTTON είναι ένας πιο ευέλικτος τύπος κουμπιού από την ετικέτα INPUT. Αυτή η ετικέτα απαιτεί ενεργοποίηση του Javacript.
-
- Το στοιχείο COMMAND είναι νέο στο HTML5 και παρέχει έναν τρόπο ενεργοποίησης σεναρίων και φορμών με συναφείς ενέργειες. Ενεργοποιείται με JavaScript.
Το στοιχείο INPUT
Το στοιχείο INPUT είναι ο πιο συνηθισμένος τρόπος υποβολής μιας φόρμας, το μόνο που κάνετε είναι να επιλέξετε έναν τύπο (κουμπί, εικόνα ή υποβολή) και, εάν είναι απαραίτητο, να προσθέσετε κάποια δέσμη ενεργειών για να υποβάλετε τη δράση της φόρμας.
Το στοιχείο μπορεί να γραφτεί ακριβώς έτσι. Αλλά αν το κάνετε, θα έχετε διαφορετικά αποτελέσματα σε διαφορετικά προγράμματα περιήγησης. Τα περισσότερα προγράμματα περιήγησης κάνουν ένα κουμπί που λέει "Υποβολή", αλλά ο Firefox κάνει ένα κουμπί που λέει "Υποβολή ερωτήματος". Για να αλλάξετε αυτό που λέει το κουμπί, θα πρέπει να προσθέσετε ένα χαρακτηριστικό:
τιμή = "Υποβολή εντύπου">
Το στοιχείο γράφεται έτσι, αλλά αν αφήσετε εκτός όλων των άλλων χαρακτηριστικών, όλα αυτά που θα εμφανίζονται στα προγράμματα περιήγησης είναι ένα κενό γκρι κουμπί. Για να προσθέσετε κείμενο στο κουμπί, χρησιμοποιήστε το χαρακτηριστικό τιμής. Αλλά αυτό το κουμπί δεν θα υποβάλει τη φόρμα αν δεν χρησιμοποιείτε JavaScript.
onclick = "υποβάλω ();">
Είναι παρόμοιο με τον τύπο κουμπιού, ο οποίος χρειάζεται ένα σενάριο για να υποβάλει τη φόρμα. Εκτός από το ότι αντί για μια τιμή κειμένου, πρέπει να προσθέσετε μια διεύθυνση προέλευσης εικόνας.
src = "submit.gif">
Το στοιχείο BUTTON
Το στοιχείο BUTTON απαιτεί τόσο μια ετικέτα ανοίγματος όσο και μια ετικέτα κλεισίματος. Όταν το χρησιμοποιείτε, κάθε περιεχόμενο που περικλείετε μέσα στην ετικέτα θα περικλείεται σε ένα κουμπί. Στη συνέχεια, ενεργοποιείτε το κουμπί με ένα σενάριο.
Φόρμα υποβολής
Μπορείτε να συμπεριλάβετε εικόνες στο κουμπί σας ή να συνδυάσετε εικόνες και κείμενο για να δημιουργήσετε ένα πιο ενδιαφέρον κουμπί.
Φόρμα υποβολής
Το στοιχείο COMMAND
Το στοιχείο COMMAND είναι νέο με HTML5. Δεν χρειάζεται να χρησιμοποιηθεί FORM, αλλά μπορεί να λειτουργήσει ως κουμπί υποβολής για μια φόρμα. Αυτό το στοιχείο σας επιτρέπει να δημιουργήσετε περισσότερες διαδραστικές σελίδες χωρίς να χρειάζεστε φόρμες αν δεν χρειάζεστε πραγματικά έντυπα. Αν θέλετε η εντολή να πει κάτι, γράφετε τις πληροφορίες σε ένα χαρακτηριστικό ετικέτας.
ετικέτα = "Υποβολή εντύπου">
Αν θέλετε η εντολή σας να αναπαρασταθεί από μια εικόνα, χρησιμοποιείτε το χαρακτηριστικό εικονίδιο.
εικονίδιο = "submit.gif">
Αυτό το άρθρο είναι μέρος του HTML φόρμας εκμάθησης. Διαβάστε το πλήρες σεμινάριο για να μάθετε πώς να χρησιμοποιείτε φόρμες HTML.
Οι φόρμες HTML έχουν πολλούς διαφορετικούς τρόπους υποβολής, όπως έχετε μάθει στην προηγούμενη σελίδα. Δύο από αυτές τις μεθόδους είναι η ετικέτα INPUT και η ετικέτα BUTTON. Υπάρχουν βάσιμοι λόγοι για να χρησιμοποιήσετε και τα δύο αυτά στοιχεία.
Το στοιχείο INPUT
Η ετικέτα είναι ο ευκολότερος τρόπος υποβολής μιας φόρμας. Δεν απαιτεί τίποτα πέρα από την ίδια την ετικέτα, ούτε καν αξία. Όταν ένας πελάτης κάνει κλικ στο κουμπί, υποβάλλει αυτόματα. Δεν χρειάζεται να προσθέσετε δέσμες ενεργειών, τα προγράμματα περιήγησης γνωρίζουν ότι πρέπει να υποβάλετε τη φόρμα όταν κάνετε κλικ στην ετικέτα εισόδου INPUT.
Το πρόβλημα είναι ότι αυτό το κουμπί είναι πολύ άσχημο και απλό. Δεν μπορείτε να προσθέσετε εικόνες σε αυτό. Μπορείτε να το στυλ όπως ακριβώς και οποιοδήποτε άλλο στοιχείο, αλλά μπορεί ακόμα να αισθάνεται σαν ένα άσχημο κουμπί.
Χρησιμοποιήστε τη μέθοδο INPUT όταν η φόρμα σας πρέπει να είναι προσβάσιμη ακόμη και σε προγράμματα περιήγησης που έχουν απενεργοποιήσει το JavaScript.
Το στοιχείο BUTTON
Το στοιχείο BUTTON προσφέρει περισσότερες επιλογές για την υποβολή αιτήσεων. Μπορείτε να τοποθετήσετε οτιδήποτε μέσα σε ένα στοιχείο BUTTON και να το μετατρέψετε σε κουμπί υποβολής. Οι χρήστες συνήθως χρησιμοποιούν εικόνες και κείμενο. Αλλά θα μπορούσατε να δημιουργήσετε ένα DIV και να κάνετε ολόκληρο το πράγμα ένα κουμπί υποβολής, αν θέλετε.
Το μεγαλύτερο μειονέκτημα για το στοιχείο BUTTON είναι ότι δεν υποβάλλει αυτόματα τη φόρμα. Αυτό σημαίνει ότι πρέπει να υπάρχει κάποιο είδος σεναρίου για να το ενεργοποιήσετε. Και έτσι είναι λιγότερο προσιτό από τη μέθοδο INPUT. Οποιοσδήποτε χρήστης δεν έχει ενεργοποιημένη τη JavaScript, δεν θα μπορεί να υποβάλει μια φόρμα με μόνο ένα στοιχείο BUTTON για να το υποβάλει.
Χρησιμοποιήστε τη μέθοδο BUTTON σε φόρμες που δεν είναι τόσο κρίσιμες. Επίσης, αυτός είναι ένας πολύ καλός τρόπος για να προσθέσετε επιπλέον επιλογές υποβολής σε μια φόρμα.
Αυτό το άρθρο είναι μέρος του HTML φόρμας εκμάθησης . Διαβάστε το για να μάθετε περισσότερα σχετικά με τον τρόπο χρήσης των εντύπων HTML