Αυτή η συγγραφή θα καλύψει τα ακόλουθα θέματα:
- Πώς να απενεργοποιήσετε το πεδίο εισαγωγής κειμένου;
- Πώς να απενεργοποιήσετε την επιλογή Select Box;
- Πώς να απενεργοποιήσετε το στοιχείο εισαγωγής πλαισίου ελέγχου;
- Πώς να απενεργοποιήσετε το στοιχείο εισαγωγής κουμπιού;
Προϋπόθεση: Δημιουργία φόρμας
Πρώτα, δημιουργήστε μια φόρμα χρησιμοποιώντας το HTML ' <φόρμα> ' στοιχείο:
< μορφή >< / μορφή >
Στη συνέχεια, προσθέστε ένα ' <σύνολο πεδίων> 'στοιχείο και αντιστοιχίστε του μια κλάση' συν-12 '. Μέσα στο στοιχείο
< σύνολο πεδίων τάξη = 'col-md-12' >
< θρύλος >Φόρμα Εγγραφής Φοιτητών< / θρύλος >
< / σύνολο πεδίων >
Παραγωγή
Πώς να απενεργοποιήσετε το πεδίο εισαγωγής κειμένου;
Για το συνεχιζόμενο παράδειγμα, ακολουθήστε τις οδηγίες που δίνονται:
- Μεσα στην ' <σύνολο πεδίων> ' στοιχείο, μετά το στοιχείο legend, προσθέστε μια ετικέτα και αντιστοιχίστε της μια κλάση ' μορφή-ομάδα '.
- Στη συνέχεια, συμπεριλάβετε ' <ετικέτα> ' και ' <εισαγωγή> ” στοιχεία για τα πεδία λεζάντας και εισαγωγής, αντίστοιχα. Αντιστοιχίστε το στοιχείο εισόδου σε μια κλάση ' μορφή-έλεγχος '.
- Μετά από αυτό, διαθέστε το ' άτομα με ειδικές ανάγκες ” για να απενεργοποιήσετε το πεδίο εισαγωγής:
< div τάξη = 'φόρμα-ομάδα' >
< επιγραφή > Εισάγετε το δικό σας Ονομα
< εισαγωγή τύπος = 'κείμενο' τάξη = 'Έλεγχος μορφής' απενεργοποιημένο>
< / επιγραφή >
< / div >Ακολουθεί η εξήγηση των τάξεων που αναφέρονται παραπάνω:
- ' μορφή-ομάδα ” είναι μια ευέλικτη κλάση που παρέχει τον απλούστερο τρόπο συμπερίληψης δομής σε φόρμες.
- ' μορφή-έλεγχος ” προσθέτει αυτόματα στυλ στα στοιχεία της φόρμας.
Παραγωγή
Προσθέστε ένα άλλο πεδίο εισαγωγής χωρίς το ' άτομα με ειδικές ανάγκες ' Χαρακτηριστικό:
< div τάξη = 'φόρμα-ομάδα' >
< επιγραφή >Μπείτε στον Πατέρα σας Ονομα
< εισαγωγή τύπος = 'κείμενο' τάξη = 'Έλεγχος μορφής' >
< / επιγραφή >
< / div >Μπορεί να παρατηρηθεί ότι το πρώτο πεδίο εισαγωγής είναι απενεργοποιημένο και το δεύτερο είναι ενεργοποιημένο:
Πώς να απενεργοποιήσετε την επιλογή Select Box;
Για να δημιουργήσετε ένα πλαίσιο επιλογής στη φόρμα, χρησιμοποιήστε το HTML ' <επιλογή> ' στοιχείο. Ο ' <επιλογή> Τα στοιχεία προστίθενται στη συνέχεια σε επιλεγμένα στοιχεία πλαισίου.
Σε αυτό το παράδειγμα, παρατηρήστε ότι η δεύτερη επιλογή έχει οριστεί ως απενεργοποιημένη χρησιμοποιώντας το ' άτομα με ειδικές ανάγκες ' Χαρακτηριστικό:
< div τάξη = 'φόρμα-ομάδα' >
< επιγραφή > άτομα με ειδικές ανάγκες Επιλέξτε Πλαίσιο
< επιλέγω τάξη = 'Έλεγχος μορφής' >
< επιλογή >επιλέξτε < / επιλογή >
< επιλογή απενεργοποιημένο> άτομα με ειδικές ανάγκες επιλέξτε< / επιλογή >
< επιλογή >Μενού< / επιλογή >
< / επιλέγω >
< / επιγραφή >
< / div >Παραγωγή
Πώς να απενεργοποιήσετε το στοιχείο εισαγωγής πλαισίου ελέγχου;
Ας δημιουργήσουμε ένα άλλο πλαίσιο ελέγχου φόρμας. Για να απενεργοποιήσετε το πλαίσιο ελέγχου, το ' άτομα με ειδικές ανάγκες ” το χαρακτηριστικό καθορίζεται ως εξής:
< div τάξη = 'έλεγχος φόρμας' >
< επιγραφή τάξη = 'φόρμα-έλεγχος-ετικέτα' >
< εισαγωγή τάξη = 'φόρμα-έλεγχος-εισαγωγή' τύπος = 'πλαίσιο ελέγχου' απενεργοποιημένο>
Μπορείς μην το τσεκάρεις αυτό
Παραγωγή
Πώς να απενεργοποιήσετε το στοιχείο εισαγωγής κουμπιού;
Μπορείτε επίσης να προσθέσετε ένα στοιχείο κουμπιού HTML για την υποβολή της φόρμας. Τώρα, ας απενεργοποιήσουμε αυτό το κουμπί χρησιμοποιώντας το ' άτομα με ειδικές ανάγκες ” τάξη:
< κουμπί τύπος = 'υποβάλλουν' τάξη = ' btn btn-κύριο btn-lg απενεργοποιημένο' >Υποβολή< / κουμπί >Παραγωγή
Όλα αυτά αφορούσαν την απενεργοποίηση των πεδίων εισαγωγής στο Bootstrap.
συμπέρασμα
Στο Bootstrap, τα στοιχεία ελέγχου φόρμας μπορούν να απενεργοποιηθούν χρησιμοποιώντας το ' άτομα με ειδικές ανάγκες ” χαρακτηριστικό ή κλάση. Το χαρακτηριστικό τοποθετείται μέσα στην αρχική ετικέτα του στοιχείου. Από την άλλη πλευρά, το « άτομα με ειδικές ανάγκες 'Η κλάση τοποθετείται μέσα στο ' τάξη ' Χαρακτηριστικό. Αυτό το άρθρο παρέχει παραδείγματα για να επεξηγήσει τον τρόπο απενεργοποίησης των στοιχείων ελέγχου φόρμας στο Bootstrap.