Kaip pažymėti / atžymėti žymimąjį laukelį naudojant „JavaScript“.

Kaip Pazymeti / Atzymeti Zymimaji Laukeli Naudojant Javascript



Žymimasis laukelis yra HTML įvesties elemento tipas, leidžiantis vartotojui pasirinkti vieną iš kelių parinkčių. Kartais gali susiklostyti situacija, kai reikia pažymėti arba atžymėti žymimuosius laukelius, kai pildote klausimyną, viktoriną ar kai kurias programas, kurioms reikia vienu metu patikrinti konkrečius arba visus leidimus, kad būtų galima tęsti.

Šiame įraše bus aprašyta procedūra, kaip patikrinti ir panaikinti žymės langelį naudojant „JavaScript“.

Kaip pažymėti / atžymėti žymimąjį laukelį naudojant „JavaScript“?

Jei norite pažymėti arba panaikinti žymimuosius laukelius „JavaScript“, naudokite „ patikrinta “ atributas. Pirmiausia gaukite nuorodą į HTML elementą ' žymimasis langelis 'su jam priskirtu' id ' naudojant ' getElementById() “ metodą, tada naudokite „ patikrinta “ turtą pagal jo vertę.





1 pavyzdys: pažymėkite / atžymėkite vieną žymimąjį laukelį
Pirmiausia sukurkite HTML failą su šiomis kodo eilutėmis:



< h3 > Spustelėkite mygtukus, kad pažymėtumėte arba panaikintumėte žymės langelio žymėjimą h3 >
< įvesties tipas = 'žymimasis langelis' id = 'žymimasis langelis' > Sutinku su sąlygomis ir sąlygomis < br >< br >
< mygtuko tipas = 'mygtukas' paspaudus = 'patikrinti()' > Taip mygtuką >
< mygtuko tipas = 'mygtukas' paspaudus = 'atžymėti ()' > Ne mygtuką >

Aukščiau pateiktame kode:



  • Sukurkite žymimąjį laukelį su ID ' žymimasis langelis “, kuris bus naudojamas norint pasiekti elementą “ žymimasis langelis “ veiksmams atlikti.
  • Sukurkite du mygtukus „ Taip “ ir „ Ne “, norėdami pažymėti arba panaikinti žymės langelio, kuris suaktyvins funkciją „ patikrinti() “ ir „ panaikinti žymėjimą () “ atitinkamai paspaudimo įvykyje.

Įvykdžius aukščiau pateiktą kodą, išvestis bus tokia:





Tada apibrėžkite funkcijas, skirtas atlikti veiksmus su žymimuoju laukeliu „JavaScript“ faile arba žymoje. Norėdami pažymėti žymimąjį laukelį, naudokite toliau pateiktas kodo eilutes:



funkcija patikrinti ( ) {
leiskite įvesti = dokumentas. getElementById ( 'žymimasis langelis' ) ;
įvestis. patikrinta = tiesa ;
}

Aukščiau pateiktame kode:

  • Apibrėžkite funkciją ' patikrinti() “, kuris suaktyvins mygtuką, spustelėdami pažymėkite žymimąjį laukelį.
  • Funkcijos turinyje gaukite žymės langelio nuorodą naudodami jo ID ' žymimasis langelis “, naudojant “ getElementById() 'metodą ir išsaugokite jį kintamajame' įvestis “.
  • Pažymėkite žymimąjį laukelį nustatydami „ patikrinta ' nuosavybė ' tiesa “.

Norėdami panaikinti žymės langelio žymėjimą spustelėdami „ Ne “, naudokite toliau pateiktą kodą:

funkcija panaikinkite žymėjimą ( ) {
leiskite įvesti = dokumentas. getElementById ( 'žymimasis langelis' ) ;
įvestis. patikrinta = klaidinga ;
}

Aukščiau pateiktas kodo fragmentas:

  • Apibrėžkite funkciją ' panaikinti žymėjimą () “, kuris suaktyvins mygtuko paspaudimą, kad panaikintumėte žymės langelio žymėjimą.
  • Funkcijos turinyje gaukite žymės langelio nuorodą naudodami jo ID ' žymimasis langelis “, naudojant “ getElementById() 'metodą ir išsaugokite jį kintamajame' įvestis “.
  • Panaikinkite žymės langelio žymėjimą nustatydami „ patikrinta ' nuosavybė ' klaidinga “.

Galiausiai nustatykite funkciją, kad pagal numatytuosius nustatymus būtų panaikintas žymės langelio žymėjimas įkeliant puslapį naudodami „ langas.atsiuntimas “ renginys:

langas. įkėlimas = funkcija ( ) {
langas. addEventListener ( 'pakrauti' , patikrinti , klaidinga ) ;
}

Išvestis

Išvestis reiškia, kad spustelėjus mygtukus žymės langelis buvo pažymėtas ir panaikintas.

2 pavyzdys: Pažymėkite / atžymėkite kelis žymimuosius laukelius
Pažiūrėkime, kaip vienu metu pažymėti visus žymimuosius laukelius arba panaikinti jų žymėjimą.

Pirmiausia sukurkite HTML failą, tada sukurkite kelis žymimuosius laukelius ir mygtuką su ID ' perjungti “, kuris perjungs žymimąjį laukelį, kad būtų galima pažymėti arba panaikinti žymėjimą:

< h3 > Spustelėkite mygtuką, norėdami pažymėti visus žymimuosius laukelius arba panaikinti jų žymėjimą h3 >
< įvesties tipas = 'žymimasis langelis' klasė = 'žymimasis langelis' > Pažymėkite arba panaikinkite mane < br >
< įvesties tipas = 'žymimasis langelis' klasė = 'žymimasis langelis' > Pažymėkite arba panaikinkite mane < br >
< įvesties tipas = 'žymimasis langelis' klasė = 'žymimasis langelis' > Pažymėkite arba panaikinkite mane < br >
< įvesties tipas = 'žymimasis langelis' klasė = 'žymimasis langelis' > Pažymėkite arba panaikinkite mane < br >
< įvesties tipas = 'žymimasis langelis' klasė = 'žymimasis langelis' > Pažymėkite arba panaikinkite mane < br >< br >
< įvesties tipas = 'mygtukas' id = 'perjungti' vertė = 'Spustelėkite, kad perjungtumėte žymimuosius langelius' >

Atitinkama išvestis bus tokia:

Po to „JavaScript“ faile arba žymoje