Kako označiti/odznačiti potvrdni okvir pomoću JavaScripta

Kako Oznaciti/odznaciti Potvrdni Okvir Pomocu Javascripta



Potvrdni okvir je vrsta HTML elementa unosa koji korisniku omogućuje odabir jedne od nekoliko opcija. Ponekad može doći do situacije u kojoj je potrebno označiti ili poništiti potvrdne okvire u slučaju ispunjavanja upitnika, kviza ili nekih aplikacija koje trebaju provjeriti bilo koja određena ili sva dopuštenja istovremeno kako bi nastavili dalje.

Ovaj zapis će opisati postupak za označavanje i poništavanje potvrdnog okvira pomoću JavaScripta.

Kako označiti/odznačiti potvrdni okvir pomoću JavaScripta?

Da biste potvrdili ili poništili potvrdne okvire u JavaScriptu, koristite ' provjereno ” atribut. Prvo uzmite referencu HTML elementa ' potvrdni okvir ' uz pomoć dodijeljenog ' iskaznica ' koristiti ' getElementById() ', a zatim primijenite ' provjereno ” imovine na svoju vrijednost.







Primjer 1: Označite/poništite odabir jednog potvrdnog okvira
Najprije izradite HTML datoteku sa sljedećim linijama koda:



< h3 > Pritisnite gumbe da označite ili poništite potvrdni okvir h3 >
< vrsta unosa = 'potvrdni okvir' iskaznica = 'potvrdni okvir' > Slažem se s odredbama i uvjetima < br >< br >
< tip gumba = 'dugme' na klik = 'ček()' > Da dugme >
< tip gumba = 'dugme' na klik = 'odznači()' > Ne dugme >

U gornjem kodu:



  • Napravite potvrdni okvir s ID-om ' potvrdni okvir ' koji će se koristiti za pristup elementu ' potvrdni okvir ” za izvođenje radnji.
  • Stvorite dva gumba, ' Da ' i ' Ne “, za označavanje ili uklanjanje potvrdnog okvira koji će pokrenuti funkciju “ ček() ' i ' poništi () ”, odnosno na događaj klika.

Nakon izvršavanja gornjeg koda, izlaz će biti ovakav:





Zatim definirajte funkcije za izvođenje radnji na potvrdnom okviru u JavaScript datoteci ili oznaci. Da biste označili potvrdni okvir, koristite donje retke koda:



funkcija ček ( ) {
dopustiti unos = dokument. getElementById ( 'potvrdni okvir' ) ;
ulazni. provjereno = pravi ;
}

U gornjem kodu:

  • Definirajte funkciju ' ček() ” koji će pokrenuti klik gumba za označavanje potvrdnog okvira.
  • Unutar tijela funkcije dohvatite referencu potvrdnog okvira koristeći njegov ID ' potvrdni okvir ' uz pomoć ' getElementById() ' metodu i pohraniti je u varijablu ' ulazni ”.
  • Označite potvrdni okvir postavljanjem ' provjereno 'imovina' pravi ”.

Da biste poništili potvrdni okvir klikom na ' Ne ” upotrijebite donji kod:

funkcija odznačiti ( ) {
dopustiti unos = dokument. getElementById ( 'potvrdni okvir' ) ;
ulazni. provjereno = lažno ;
}

Gornji isječak koda:

  • Definirajte funkciju ' poništi () ” koji će pokrenuti klik gumba za poništavanje potvrdnog okvira.
  • Unutar tijela funkcije dohvatite referencu potvrdnog okvira koristeći njegov ID ' potvrdni okvir ' uz pomoć ' getElementById() ' metodu i pohraniti je u varijablu ' ulazni ”.
  • Poništite potvrdni okvir postavljanjem ' provjereno 'imovina' lažno ”.

Na kraju, definirajte funkciju za poništavanje potvrdnog okvira prema zadanim postavkama pri učitavanju stranice pomoću ' prozor.onload ” događaj:

prozor. onload = funkcija ( ) {
prozor. addEventListener ( 'opterećenje' , ček , lažno ) ;
}

Izlaz

Izlaz znači da je potvrdni okvir uspješno označen i poništen dok se klika na gumbe.

Primjer 2: Označite/odznačite više potvrdnih okvira
Pogledajmo primjer kako označiti ili poništiti sve potvrdne okvire u isto vrijeme.

Najprije izradite HTML datoteku, a zatim izradite više potvrdnih okvira i gumb s ID-om ' prebaciti ” koji će označiti ili poništiti potvrdni okvir:

< h3 > Pritisnite gumb da označite ili poništite sve potvrdne okvire h3 >
< vrsta unosa = 'potvrdni okvir' razreda = 'potvrdni okvir' > Označi me ili odznači < br >
< vrsta unosa = 'potvrdni okvir' razreda = 'potvrdni okvir' > Označi me ili odznači < br >
< vrsta unosa = 'potvrdni okvir' razreda = 'potvrdni okvir' > Označi me ili odznači < br >
< vrsta unosa = 'potvrdni okvir' razreda = 'potvrdni okvir' > Označi me ili odznači < br >
< vrsta unosa = 'potvrdni okvir' razreda = 'potvrdni okvir' > Označi me ili odznači < br >< br >
< vrsta unosa = 'dugme' iskaznica = 'prebaci' vrijednost = 'Kliknite za promjenu potvrdnih okvira' >

Odgovarajući izlaz će biti:

Nakon toga, u JavaScript datoteci ili