Ta članek ponazarja namen, delovanje in uporabo lastnosti »onemogočeno« potrditveno polje vnosa HTML DOM v JavaScriptu.
Kako deluje lastnost »onemogočeno« potrditveno polje za vnos HTML DOM v JavaScriptu?
Potrditveno polje za vnos ' onemogočeno ” lastnost je odvisna od atributa “checkbox”. Deluje na obrazcih HTML in vnosnih poljih, da onemogoči ali onemogoči podana potrditvena polja.
Sintaksa (nastavi onemogočeno lastnost)
potrditveno poljePredmet. onemogočeno = prav | lažnoV skladu z definirano sintakso povratka lastnost »onemogočeno« podpira dva parametra, ki sta navedena kot sledi:
- prav: To pomeni, da je ustrezno potrditveno polje onemogočeno.
- false (privzeta vrednost): To je neobvezna vrednost, ki označuje, da povezano potrditveno polje ni onemogočeno.
Vračilo (Vrnite onemogočeno lastnino)
potrditveno poljePredmet. onemogočenoV zgornji sintaksi je » potrditveno poljePredmet ' ustreza HTML ' potrditveno polje ” element.
Uporabimo zgoraj definirane sintakse v spodnjih primerih, da razumemo praktično izvajanje lastnosti »onemogočeno«.
Primer 1: Uporaba lastnosti »onemogočeno« potrditvenega polja vnosa Uporaba osnovne sintakse
V prvem primeru je dodano »potrditveno polje«, da ga onemogočite z uporabo definirane splošne sintakse.
HTML koda
Najprej analizirajte dano kodo HTML:
< stil telesa = 'poravnava besedila: sredina' >
< h2 > HTML Vnos DOM Potrditveno polje onemogočeno Lastnost v JavaScriptu h2 >
Potrditveno polje : < vrsta vnosa = 'potrditveno polje' id = 'demo' > Obrazec oddan < št >< št >
< str > Podano potrditveno polje je onemogočeno str >
V zgornjih vrsticah kode:
- '
” določa del telesa, ki je poravnan z center « s pomočjo » stil ” atribut. - ' ” določa podnaslov 2. stopnje.
- '
” ustvari “potrditveno polje” tako, da določi vrsto vnosa “ potrditveno polje 'ima dodeljen ID' demo ”. - ' ” doda element odstavka za prikaz nastalega rezultata.
Koda JavaScript
Nato si oglejte kodo JavaScript:
< scenarij >dokument. getElementById ( 'demo' ) . onemogočeno = prav ;
scenarij >
V zgornjem delčku kode je » document.getElementById() ” se uporabi metoda za pridobivanje potrditvenega polja z uporabo njegovega ID-ja “demo” in vrednost lastnosti “disabled” je nastavljena na “ prav «, ki onemogoči potrditveno polje.
Izhod
Zgornji izhod potrjuje, da je dano potrditveno polje onemogočeno zaradi » onemogočeno lastnost nastavljena na prav ”.
Primer 2: Vrnitev vrednosti lastnosti »onemogočenega« potrditvenega polja vnosa
Ta primer uporabi lastnost »onemogočeno«, da vrne status ciljnega potrditvenega polja kot logično vrednost (true/false).
HTML koda
Razmislite o naslednji kodi HTML:
< stil telesa = 'poravnava besedila: sredina' >< h2 > HTML Vnos DOM Potrditveno polje onemogočeno Lastnost v JavaScriptu h2 >
Potrditveno polje : < vrsta vnosa = 'potrditveno polje' onemogočeno = prav id = 'demo' > Obrazec oddan < št >< št >
< p id = 'vzorec' > str >
V zgornjem kodnem bloku:
- Potrditveno polje je dodeljeno in stanje » onemogočeno Lastnost je nastavljena na prav ”.
- Po tem prazen ' « je dodan element z dodeljenim ID-jem »vzorec« za dodajanje izhoda.
Koda JavaScript
Zdaj pa nadaljujte s kodo JavaScript:
< scenarij >obstaja a = dokument. getElementById ( 'demo' ) . onemogočeno ;
dokument. getElementById ( 'vzorec' ) . notranjiHTML = a ;
scenarij >
V zgornji kodi:
- Spremenljivka ' a ' uporablja ' document.getElementById() « za dostop do potrditvenega polja z njegovim ID-jem »demo« in povezavo » onemogočeno ”, da preverite, ali je pridobljeno potrditveno polje onemogočeno ali ne.
- Znova uporabljena metoda »document.getElementById()« pridobi vključen prazen odstavek in prikaže status lastnosti »onemogočeno« kot odstavek.
Izhod
Kot je bilo analizirano, rezultat vrne status dodeljenega »potrditvenega polja«, tj. prav ”.
Primer 3: onemogočanje in onemogočanje potrditvenega polja z uporabo lastnosti »onemogočeno« potrditvenega polja vnosa
Poleg nastavitve in vrnitve statusa potrditvenega polja lastnost »onemogočeno« uporabnikom omogoča tudi, da istočasno onemogočijo in onemogočijo potrditveno polje. Oglejmo si praktično.
HTML koda
Oglejmo si napisano kodo HTML:
< stil telesa = 'poravnava besedila: sredina' >< h2 > HTML Vnos DOM Potrditveno polje onemogočeno Lastnost v JavaScriptu h2 >
Potrditveno polje : < vrsta vnosa = 'potrditveno polje' id = 'demo' > Obrazec oddan vnos >< št >< št >
< gumb na klik = 'checkDisable()' > Onemogoči potrditveno polje gumb >
< gumb na klik = 'checkUndisable()' > Onemogoči potrditveno polje gumb >
V zgornjem kodnem bloku:
- Podobno vključite potrditveno polje in dodajte gumb z ' onclick ' dogodek, ki izvede ' preveriDisable() ” ob kliku na gumb.
- Po tem je dodan drugi gumb, ki prav tako uporablja obravnavo dogodka »onclick« za izvedbo » checkUndiable() ” ob kliku gumba.
Koda JavaScript
Nato pojdite skozi spodnjo kodo:
< scenarij >preverjanje funkcije Onemogoči ( ) {
dokument. getElementById ( 'demo' ) . onemogočeno = prav ;
}
funkcija checkUndiable ( ) {
dokument. getElementById ( 'demo' ) . onemogočeno = lažno ;
}
scenarij >
V zgornjih vrsticah kode:
- Definirajte funkcijo z imenom ' preveriDisable() «, ki velja za » document.getElementById() ”, da pristopite k potrditvenemu polju prek njegovega ID-ja “demo” in nastavite njegovo vrednost na “true”.
- Druga funkcija ' checkUndiable() ” ponovno uporabi metodo “document.getElementById()” za ponovni dostop do potrditvenega polja in nastavi njegovo vrednost na “false”, če uporabnik klikne vključeni drugi gumb z imenom “Undisable the checkbox”.
Izhod
Izhod »onemogoči« dano potrditveno polje, ko uporabnik klikne prvi gumb, in ga »razveljavi«, če uporabnik ustrezno klikne drugi gumb.
Zaključek
V JavaScriptu potrditveno polje za vnos HTML DOM ' onemogočeno Lastnost pomaga uporabnikom, da nastavijo in vrnejo potrjeno stanje »potrditvenega polja«. Definira posplošene sintakse za procese 'set' in 'return'. Njegova nastavljena sintaksa deluje na dveh vrednostih ' prav « in » lažno ”. Po drugi strani pa njegova povratna sintaksa ne zahteva nobenega parametra. Ta članek je prikazal cilj, delujočo in praktično implementacijo lastnosti »onemogočeno« potrditveno polje vnosa HTML DOM v JavaScriptu.