כתבה זו יכסה את הנושאים הבאים:
- כיצד להשבית שדה קלט טקסט?
- כיצד להשבית את האפשרות בחר תיבת?
- כיצד לבטל את רכיב הקלט של תיבת סימון?
- כיצד להשבית את רכיב קלט הכפתור?
תנאי מוקדם: יצירת טופס
ראשית, צור טופס על ידי שימוש ב-HTML ' <טופס> ' אלמנט:
< טופס >< / טופס >
לאחר מכן, הוסף ' ' רכיב ולהקצות לו מחלקה ' col-12 '. בתוך האלמנט
< ערכת שדה מעמד = 'col-md-12' >
< אגדה >טופס רישום סטודנטים< / אגדה >
< / ערכת שדה >
תְפוּקָה
כיצד להשבית שדה קלט טקסט?
עבור הדוגמה המתמשכת, עקוב אחר ההוראות שניתנו:
- בתוך ה ' ', לאחר רכיב האגדה, הוסף תג והקצה לו מחלקה ' טופס-קבוצה '.
- לאחר מכן, כלול את ' <תווית> ' ו' <קלט> ' אלמנטים עבור שדות הכיתוב והקלט, בהתאמה. הקצה לרכיב הקלט מחלקה ' שליטה בטופס '.
- לאחר מכן, הקצו את ' נָכֶה ' תכונה להשבתת שדה הקלט:
< div מעמד = 'טופס-קבוצה' >
< תווית > הכנס את שלך שֵׁם
< קֶלֶט סוּג = 'טֶקסט' מעמד = 'בקרת צורה' מושבת>
< / תווית >
< / div >להלן ההסבר על השיעורים שהוזכרו לעיל:
- ' טופס-קבוצה ” הוא מחלקה גמישה המספקת את הדרך הפשוטה ביותר לכלול מבנה בטפסים.
- ' שליטה בטופס ' מוסיף סגנון אוטומטי לרכיבי הטופס.
תְפוּקָה
הוסף שדה קלט נוסף ללא ' נָכֶה ' תכונה:
< div מעמד = 'טופס-קבוצה' >
< תווית > הכנס את אביך שֵׁם
< קֶלֶט סוּג = 'טֶקסט' מעמד = 'בקרת צורה' >
< / תווית >
< / div >ניתן לראות ששדה הקלט הראשון מושבת והשני מופעל:
כיצד לבטל אפשרות בחירת תיבה?
כדי ליצור תיבת בחירה בטופס, השתמש ב-HTML ' <בחר> ' אלמנט. ה ' <אופציה> לאחר מכן מוסיפים אלמנטים לפריטי תיבה נבחרים.
בדוגמה זו, שים לב שהאפשרות השנייה מוגדרת כבלתי זמינה באמצעות ' נָכֶה ' תכונה:
< div מעמד = 'טופס-קבוצה' >
< תווית > נָכֶה בחר תיבה
< בחר מעמד = 'בקרת צורה' >
< אוֹפְּצִיָה >בחר < / אוֹפְּצִיָה >
< אוֹפְּצִיָה מושבת> נָכֶה בחר < / אוֹפְּצִיָה >
< אוֹפְּצִיָה >תפריט< / אוֹפְּצִיָה >
< / בחר >
< / תווית >
< / div >תְפוּקָה
כיצד לבטל את רכיב הקלט של תיבת סימון?
בואו נעשה תיבת סימון נוספת של בקרת טפסים. כדי להפוך את תיבת הסימון לבלתי זמינה, ' נָכֶה ' תכונה מצוינת באופן הבא:
< div מעמד = 'בדיקת טופס' >
< תווית מעמד = 'טופס-בדוק-תווית' >
< קֶלֶט מעמד = 'טופס-בדיקת קלט' סוּג = 'תיבת סימון' מושבת>
אתה יכול אל תבדוק את זה
תְפוּקָה
כיצד להשבית את רכיב קלט הכפתור?
אתה יכול גם להוסיף רכיב לחצן HTML עבור שליחת הטופס. כעת, בואו נהפוך את הכפתור הזה לבלתי זמין על ידי שימוש ב' נָכֶה ' מעמד:
< לַחְצָן סוּג = 'שלח' מעמד = 'btn btn-primary btn-lg מושבת' >שלח< / לַחְצָן >תְפוּקָה
זה היה הכל על הפיכת שדות הקלט ללא זמינים ב-Bootstrap.
סיכום
ב-Bootstrap, ניתן להפוך את פקדי הטופס ללא זמינים באמצעות ' נָכֶה ' תכונה או מחלקה. התכונה ממוקמת בתוך תג ההתחלה של האלמנט. מצד שני, ה' נָכֶה מחלקה ממוקמת בתוך ' מעמד ' תכונה. מאמר זה סיפק דוגמאות כדי להמחיש כיצד להשבית את פקדי הטופס ב-Bootstrap.