מאמר זה ממחיש את המטרה, העבודה והשימוש של המאפיין HTML DOM Input Checkbox 'disabled' ב-JavaScript.
כיצד פועלת תיבת הסימון של קלט HTML DOM 'מושבתת' ב-JavaScript?
תיבת הסימון של הקלט ' נָכֶה ' המאפיין תלוי בתכונה 'תיבת סימון'. זה עובד על טפסי HTML ושדות קלט כדי להשבית ולבטל את השבתת תיבות הסימון הנתונות.
תחביר (הגדר את המאפיין המושבת)
checkboxObject. נָכֶה = נָכוֹן | שֶׁקֶרעל פי תחביר ההחזר המוגדר, המאפיין 'disabled' תומך בשני פרמטרים המפורטים כדלקמן:
- נָכוֹן: זה מייצג שתיבת הסימון המתאימה מושבתת.
- false (ערך ברירת מחדל): זהו ערך אופציונלי המציין שתיבת הסימון המשויכת אינה מושבתת.
החזר (החזר את הנכס המושבת)
checkboxObject. נָכֶהבתחביר לעיל, ה-' checkboxObject ' מתאים ל-HTML ' תיבת סימון ' אלמנט.
בואו נשתמש בתחבירים שהוגדרו לעיל בדוגמאות שלהלן כדי להבין את היישום המעשי של המאפיין 'מושבת'.
דוגמה 1: החלת תיבת סימון הקלט 'מושבתת' מאפיין שימוש בתחביר בסיסי
בדוגמה הראשונה, 'תיבת הסימון' מתווספת כדי להשבית אותה באמצעות התחביר המוכלל המוגדר.
קוד HTML
ראשית, נתח את קוד ה-HTML הנתון:
< סגנון גוף = 'טקסט-align: center' >
< h2 > HTML קלט DOM תיבת סימון נכס מושבת ב-JavaScript h2 >
תיבת סימון : < סוג קלט = 'תיבת סימון' תְעוּדַת זֶהוּת = 'הַדגָמָה' > הטופס נשלח < br >< br >
< ע > תיבת הסימון הנתונה מושבתת ע >
בשורות הקוד לעיל:
- ה ' <גוף> תג ' מציין את קטע הגוף שמיושר ל' מֶרְכָּז 'בעזרת ה' סִגְנוֹן ' תכונה.
- ה ' 'תג מגדיר את כותרת המשנה של רמה 2.
- ה ' <קלט> 'תג יוצר 'תיבת סימון' על ידי ציון סוג הקלט ' תיבת סימון 'לקבלת מזהה מוקצה' הַדגָמָה '.
- ה ' ' תג מוסיף רכיב פסקה כדי להציג את התוצאה המתקבלת.
קוד JavaScript
לאחר מכן, עיין בקוד JavaScript:
< תַסרִיט >מסמך. getElementById ( 'הַדגָמָה' ) . נָכֶה = נָכוֹן ;
תַסרִיט >
בקטע הקוד שלמעלה, ' document.getElementById() שיטת ' מופעלת כדי להביא את תיבת הסימון באמצעות המזהה שלה 'demo' והערך של המאפיין 'disabled' מוגדר ל- ' נָכוֹן ' מה שמבטל את תיבת הסימון.
תְפוּקָה
הפלט לעיל מאשר שתיבת הסימון הנתונה מושבתת בגלל ' נָכֶה מאפיין מוגדר ל- נָכוֹן '.
דוגמה 2: החזרת ערך המאפיין 'מושבת' של תיבת סימון הקלט
דוגמה זו מחילה את המאפיין 'disabled' כדי להחזיר את הסטטוס של תיבת הסימון הממוקדת כערך בוליאני (true/false).
קוד HTML
שקול את קוד ה-HTML הבא:
< סגנון גוף = 'טקסט-align: center' >< h2 > HTML קלט DOM תיבת סימון השבתת נכס ב-JavaScript h2 >
תיבת סימון : < סוג קלט = 'תיבת סימון' נָכֶה = נָכוֹן תְעוּדַת זֶהוּת = 'הַדגָמָה' > הטופס נשלח < br >< br >
< p id = 'לִטעוֹם' > ע >
בגוש הקוד שלמעלה:
- תיבת הסימון מוקצית והסטטוס של ' נָכֶה ' המאפיין מוגדר ל' נָכוֹן '.
- לאחר מכן, ריק ' אלמנט ' מתווסף עם מזהה שהוקצה 'דגימה' כדי להוסיף את הפלט.
קוד JavaScript
כעת, עברו לקוד JavaScript:
< תַסרִיט >יש = מסמך. getElementById ( 'הַדגָמָה' ) . נָכֶה ;
מסמך. getElementById ( 'לִטעוֹם' ) . innerHTML = א ;
תַסרִיט >
בקוד למעלה:
- המשתנה ' א 'משתמש ב' document.getElementById() שיטת ' כדי לגשת לתיבת הסימון באמצעות המזהה 'הדגמה' ולשייך את ' נָכֶה ' מאפיין כדי לבדוק אם תיבת הסימון המאוחזרת מושבתת או לא.
- השיטה 'document.getElementById()' המוחלת שוב מביאה את הפסקה הריקה הכלולה ומציגה את הסטטוס של המאפיין 'disabled' כפסקה.
תְפוּקָה
כפי שניתח, התוצאה מחזירה את הסטטוס שהוקצה 'תיבת הסימון', כלומר ' נָכוֹן '.
דוגמה 3: השבת ובטל את השבתת תיבת הסימון באמצעות מאפיין תיבת סימון הקלט 'מושבת'
מלבד הגדרה והחזרה של מצב תיבת הסימון, המאפיין 'מושבת' מאפשר למשתמשים גם להשבית ולבטל את השבתת התיבה בו זמנית. בוא נראה את זה באופן מעשי.
קוד HTML
בואו נסקור את קוד ה-HTML הכתוב:
< סגנון גוף = 'טקסט-align: center' >< h2 > HTML קלט DOM תיבת סימון השבתת נכס ב-JavaScript h2 >
תיבת סימון : < סוג קלט = 'תיבת סימון' תְעוּדַת זֶהוּת = 'הַדגָמָה' > הטופס נשלח קֶלֶט >< br >< br >
< כפתור בלחיצה = 'checkDisable()' > השבת את תיבת הסימון לַחְצָן >
< כפתור בלחיצה = 'checkUndisable()' > השבת את תיבת הסימון לַחְצָן >
בגוש הקוד שלמעלה:
- באופן דומה, כלול תיבת סימון והוסף כפתור עם ' בלחיצה ' אירוע שמבצע את ' checkDisable() פונקציה בלחיצת הכפתור.
- לאחר מכן, נוסף הכפתור השני שמשתמש גם במטפל האירועים 'onclick' לביצוע ה-' checkUndisable() ' פונקציה כאשר הכפתור לוחץ.
קוד JavaScript
לאחר מכן, עבור על הקוד המצוין להלן:
< תַסרִיט >check function Disable ( ) {
מסמך. getElementById ( 'הַדגָמָה' ) . נָכֶה = נָכוֹן ;
}
בדיקת פונקציות בלתי ניתנת לביטול ( ) {
מסמך. getElementById ( 'הַדגָמָה' ) . נָכֶה = שֶׁקֶר ;
}
תַסרִיט >
בשורות הקוד לעיל:
- הגדר פונקציה בשם ' checkDisable() ' שמחיל את ' document.getElementById() ' שיטה לגשת לתיבת הסימון באמצעות המזהה שלה 'הדגמה' ולהגדיר את הערך שלה ל'true'.
- הפונקציה השנייה' checkUndisable() ' הפונקציה מיישמת שוב את שיטת 'document.getElementById()' כדי לגשת שוב לתיבת הסימון ולהגדיר את הערך שלה ל'false' אם המשתמש לוחץ על הכפתור השני הכלול בשם 'בטל את השבתת הסימון'.
תְפוּקָה
הפלט 'משבית' את תיבת הסימון הנתונה כאשר המשתמש לוחץ על הכפתור הראשון ו'מבטל' אותה אם המשתמש לוחץ על הכפתור השני בהתאם.
סיכום
ב-JavaScript, תיבת הסימון של קלט HTML DOM ' נָכֶה ' מאפיין מסייע למשתמשים להגדיר ולהחזיר את המצב המסומן של 'תיבת הסימון'. הוא מגדיר את התחבירים המוכללים עבור תהליכי 'סט' ו'החזרה'. התחביר המוגדר שלו עובד על שני ערכים ' נָכוֹן ' ו' שֶׁקֶר '. מצד שני, תחביר ההחזר שלו אינו דורש שום פרמטר. מאמר זה הדגים את היישום האובייקטיבי, העובד והמעשי של מאפיין HTML DOM Input Checkbox 'disabled' ב-JavaScript.