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