Ez a cikk bemutatja a HTML DOM beviteli jelölőnégyzet „letiltva” tulajdonságának célját, működését és használatát a JavaScriptben.
Hogyan működik a HTML DOM beviteli jelölőnégyzet „letiltott” tulajdonsága JavaScriptben?
A beviteli jelölőnégyzet ' Tiltva ” tulajdonság a „checkbox” attribútumtól függ. A HTML-űrlapokon és a beviteli mezőkön működik a megadott jelölőnégyzetek letiltására és letiltásának visszavonására.
Szintaxis (A letiltott tulajdonság beállítása)
jelölőnégyzet Object. Tiltva = igaz | hamisA meghatározott visszatérési szintaxis szerint a „disabled” tulajdonság két paramétert támogat, amelyek az alábbiak szerint vannak felsorolva:
- igaz: Azt jelenti, hogy a megfelelő jelölőnégyzet le van tiltva.
- false (alapértelmezett érték): Ez egy opcionális érték, amely azt jelzi, hogy a kapcsolódó jelölőnégyzet nincs letiltva.
Visszaküldés (A letiltott ingatlan visszaküldése)
jelölőnégyzet Object. TiltvaA fenti szintaxisban a „ jelölőnégyzet Object ' megfelel a HTML-nek' jelölőnégyzetet ” elemet.
Használjuk az alábbi példákban a fent meghatározott szintaxisokat, hogy megértsük a „disabled” tulajdonság gyakorlati megvalósítását.
1. példa: Az Input Checkbox „letiltott” tulajdonság alkalmazása Alapszintaxis használata
Az első példában a „jelölőnégyzet” hozzáadva letiltásra kerül a meghatározott általános szintaxis használatával.
HTML kód
Először is elemezze a megadott HTML kódot:
< teststílus = 'text-align: center' >
< h2 > HTML DOM bemenet Jelölőnégyzet Tulajdonság letiltása a JavaScriptben h2 >
Jelölőnégyzet : < bemeneti típus = 'jelölőnégyzet' id = 'demó' > Űrlap elküldve < br >< br >
< p > A megadott jelölőnégyzet le van tiltva p >
A fenti kódsorokban:
- A '
” címke azt a törzsrészt határozza meg, amely a „ központ ' segítségével a ' stílus ' tulajdonság. - A ' ” címke határozza meg a 2. szint alcímét.
- A '
' címke létrehoz egy 'jelölőnégyzetet' a ' beviteli típus megadásával jelölőnégyzetet 'hozzárendelt azonosítóval rendelkezik' demó ”. - A ' ” címke egy bekezdéselemet ad hozzá a kapott eredmény megjelenítéséhez.
JavaScript kód
Ezután nézze meg a JavaScript kódot:
< forgatókönyv >dokumentum. getElementById ( 'demó' ) . Tiltva = igaz ;
forgatókönyv >
A fenti kódrészletben a „ document.getElementById() ” metódus kerül alkalmazásra a jelölőnégyzet lekéréséhez a „demo” azonosítójával, és a „disabled” tulajdonság értéke „ igaz ”, amely letiltja a jelölőnégyzetet.
Kimenet
A fenti kimenet megerősíti, hogy az adott jelölőnégyzet le van tiltva a „ Tiltva ” tulajdonság értéke „ igaz ”.
2. példa: A beviteli jelölőnégyzet „letiltott” tulajdonságértékének visszaadása
Ez a példa a „disabled” tulajdonságot alkalmazza, hogy a megcélzott jelölőnégyzet állapotát logikai értékként adja vissza (igaz/hamis).
HTML kód
Vegye figyelembe a következő HTML-kódot:
< teststílus = 'text-align: center' >< h2 > HTML DOM bemenet Jelölőnégyzet Tulajdonság letiltása a JavaScriptben h2 >
Jelölőnégyzet : < bemeneti típus = 'jelölőnégyzet' Tiltva = igaz id = 'demó' > Űrlap elküldve < br >< br >
< p id = 'minta' > p >
A fenti kódblokkban:
- A jelölőnégyzet hozzá van rendelve, és a „ Tiltva ' tulajdonság értéke ' igaz ”.
- Ezt követően egy üres „ ” elem hozzáadásra kerül egy hozzárendelt id „mintával” a kimenet hozzáfűzéséhez.
JavaScript kód
Most lépjen tovább a JavaScript kódra:
< forgatókönyv >van egy = dokumentum. getElementById ( 'demó' ) . Tiltva ;
dokumentum. getElementById ( 'minta' ) . innerHTML = a ;
forgatókönyv >
A fenti kódban:
- A változó ' a ' használja a ' document.getElementById() ” metódussal hozzáférhet a jelölőnégyzethez a „demo” azonosítójával, és társíthatja a „ Tiltva ” tulajdonság annak ellenőrzésére, hogy a lekért jelölőnégyzet le van-e tiltva vagy sem.
- Az ismét alkalmazott „document.getElementById()” metódus lekéri a mellékelt üres bekezdést, és bekezdésként jeleníti meg a „disabled” tulajdonság állapotát.
Kimenet
Az elemzés szerint az eredmény a „jelölőnégyzet” hozzárendelt állapotot adja vissza, azaz „ igaz ”.
3. példa: A jelölőnégyzet letiltása és letiltásának visszavonása a beviteli jelölőnégyzet használatával „letiltva” tulajdonság
A jelölőnégyzet állapotának beállításán és visszaadásán túl a „disabled” tulajdonság azt is lehetővé teszi a felhasználók számára, hogy a jelölőnégyzetet egyszerre tiltsák le és vonják vissza. Lássuk a gyakorlatban.
HTML kód
Tekintsük át az írott HTML kódot:
< teststílus = 'text-align: center' >< h2 > HTML DOM bemenet Jelölőnégyzet Tulajdonság letiltása a JavaScriptben h2 >
Jelölőnégyzet : < beviteli típus = 'jelölőnégyzet' id = 'demó' > Űrlap elküldve bemenet >< br >< br >
< gomb onclick = 'checkDisable()' > Tiltsa le a jelölőnégyzetet gomb >
< gomb onclick = 'checkUndisable()' > Tiltsa le a jelölőnégyzetet gomb >
A fenti kódblokkban:
- Hasonlóképpen, adjon meg egy jelölőnégyzetet, és adjon hozzá egy gombot, amelyen egy „ kattintásra ' esemény, amely végrehajtja a ' checkDisable() ” funkciót a gombra kattintva.
- Ezt követően hozzáadódik a második gomb, amely szintén az „onclick” eseménykezelőt használja a „ checkUndisable() ” funkciót, amikor a gomb kattan.
JavaScript kód
Ezután menjen át az alábbi kódon:
< forgatókönyv >funkció ellenőrzése Letilt ( ) {
dokumentum. getElementById ( 'demó' ) . Tiltva = igaz ;
}
funkció ellenőrzése Letiltása ( ) {
dokumentum. getElementById ( 'demó' ) . Tiltva = hamis ;
}
forgatókönyv >
A fenti kódsorokban:
- Határozzon meg egy '' nevű függvényt checkDisable() ', amely a ' document.getElementById() ” módszerrel megközelítheti a jelölőnégyzetet a „demo” azonosítójával, és az értékét „true”-ra állítja.
- A második funkció' checkUndisable() ” függvény ismét alkalmazza a „document.getElementById()” metódust a jelölőnégyzet újbóli eléréséhez, és értékét „false”-ra állítja, ha a felhasználó a mellékelt második „A jelölőnégyzet letiltása” nevű gombra kattint.
Kimenet
A kimenet „letiltja” az adott jelölőnégyzetet, ha a felhasználó az első gombra kattint, és „letiltja”, ha a felhasználó ennek megfelelően kattint a második gombra.
Következtetés
A JavaScriptben a HTML DOM beviteli jelölőnégyzet ' Tiltva ” tulajdonság segíti a felhasználókat a „checkbox” bejelölt állapotának beállításában és visszaadásában. Meghatározza az általános szintaxist mind a „set”, mind a „return” folyamatokhoz. A beállított szintaxis két értéken működik ' igaz ” és „ hamis ”. Másrészt a visszatérési szintaxisa nem igényel semmilyen paramétert. Ez a cikk bemutatta a HTML DOM beviteli jelölőnégyzet „letiltva” tulajdonságának célját, működését és gyakorlati megvalósítását a JavaScriptben.