Sådan markerer og fjerner du markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript

Sadan Markerer Og Fjerner Du Markeringen Af Alle Afkrydsningsfelter Ved Hjaelp Af Javascript



Der kan være en situation, hvor alle afkrydsningsfelter skal være markeret eller fjernet i tilfælde af et spørgeskema eller quiz. For eksempel er det påkrævet at foretage flere valg fra en specifik emneliste eller slet ikke foretage noget valg, eller når du skal vælge eller rydde de valgte indstillinger i en formular på én gang. I sådanne tilfælde bliver det meget praktisk og tidsbesparende at markere og fjerne markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript.

Denne artikel vil demonstrere metoderne til at markere og fjerne markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript.

Sådan markerer og fjerner du markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript?

For at markere og fjerne markeringen i alle afkrydsningsfelter i JavaScript kan du anvende:







De nævnte tilgange vil nu blive diskuteret én efter én!



Metode 1: Marker og fjern markeringen i alle afkrydsningsfelter i JavaScript ved hjælp af 'document.getElementsByName()'-metoden med 'afkrydsningsfelter'

Det ' document.getElementsByName() ” metode returnerer elementerne med det angivne navn i sine argumenter. Denne metode vil blive anvendt til at hente værdien af ​​hvert afkrydsningsfelt ved hjælp af det beståede navn.



Lad os gennemgå følgende eksempel til demonstration.





Eksempel

Først vil inputtypen blive angivet som ' afkrydsningsfeltet ” og et specifikt navn og værdi vil blive tildelt ved hvert afkrydsningsfelt:

< input type = 'afkrydsningsfelt' navn = 'lige' værdi = 'Python' > Python < br />

< input type = 'afkrydsningsfelt' navn = 'lige' værdi = 'Java' > Java < br />

< input type = 'afkrydsningsfelt' navn = 'lige' værdi = 'JavaScript' > JavaScript < br />

Medtag nu et ekstra afkrydsningsfelt med værdien ' Tjek alle ' og vedhæft en ' onclick() ” begivenhed med dette afkrydsningsfelt, som vil fungere på en sådan måde, når afkrydsningsfeltet vil blive klikket, “ checkUchecket ()' metoden vil blive påberåbt med objektet ' dette ' som argument:



< input type = 'afkrydsningsfelt' onclick = 'checkUncheck (this)' /> Tjek alle < br />

Derefter skal du definere en funktion med navnet ' checkFjern markering() ' i JavaScript-filen med en variabel ved navn ' afkrydsningsfelt ” som argument. Få nu adgang til afkrydsningsfeltets værdier ved hjælp af ' document.getElementsByName() ' metode og placer værdien af ​​' navn ”-attribut som sit argument.

Til sidst skal du anvende en ' til '-løkke for at gentage alle afkrydsningsfeltværdierne og bruge ' kontrolleret egenskab for at markere dem alle som markeret:

funktionskontrol Fjern markeringen ( afkrydsningsfelt ) {

= dokument. getElementsByName ( 'lige' ) ;

til ( var i = 0 ; jeg < få. længde ; jeg ++ ) {

[ jeg ] . kontrolleret = afkrydsningsfelt. kontrolleret ; }

}

Som du kan se, når ' Tjek alle ” afkrydsningsfeltet er markeret, alle de andre afkrydsningsfelter er også markeret som markeret:

Metode 2: Marker og fjern markeringen af ​​alle afkrydsningsfelter i JavaScript ved hjælp af 'document.getElementsByName()'-metoden med 'knapper'

Det ' document.getElementsByName() ”-metoden, som diskuteret i den foregående metode, henter elementerne med det angivne navn i sine argumenter. Det kan bruges til at markere eller fjerne markeringen af ​​alle de tilføjede afkrydsningsfelter på en webside.

Se følgende eksempel for demonstration.

Eksempel

Nu vil vi inkludere to knapper til både ' Tjekker alle ' og ' Fjern markeringen af ​​alle ' funktionaliteter. Vedhæft derefter en ' onclick ” begivenhed med begge knapper, som vil få adgang til de specificerede funktioner separat:

< input type = 'knap' onclick = 'kontrollere()' værdi = 'Tjekker alle' />

< input type = 'knap' onclick = 'unCheck()' værdi = 'Fjerner markeringen af ​​alle' />

Dernæst skal du definere en funktion ved navn ' kontrollere() ' og anvend ' document.getElementsByName ' metode med den angivne værdi af ' navn ' attribut. Gentag derefter ' til ” sløjfe langs alle de afkrydsningsfeltværdier, der blev diskuteret i den foregående metode.

Desuden, når der klikkes på den tilknyttede knap, vises ' kontrolleret ' egenskab vil markere alle afkrydsningsfelterne og indstille den afkrydsede tilstand som ' rigtigt ”:

funktionstjek ( ) {

være ged = dokument. getElementsByName ( 'kontrollere' ) ;

til ( var i = 0 ; jeg < få. længde ; jeg ++ ) {

[ jeg ] . kontrolleret = rigtigt ; }

}

Dernæst skal du definere en funktion ved navn ' fjern markeringen () ', og tilføj den omvendte funktionalitet i den for at markere egenskaben for afkrydsningsfeltet som ' falsk ”:

funktion fjern markeringen ( ) {

være ged = dokument. getElementsByName ( 'kontrollere' ) ;

til ( var i = 0 ; jeg < få. længde ; jeg ++ ) {

[ jeg ] . kontrolleret = falsk ; }

}

Det kan se i outputtet, at de tilføjede knapper fungerer perfekt:

Vi har givet de nemmeste metoder til at markere og fjerne markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript.

Konklusion

For at markere og fjerne markeringen af ​​alle afkrydsningsfelterne ved hjælp af JavaScript, skal du bruge ' document.getElementsByName() ' metode med ' Afkrydsningsfelter ” for at tilføje et afkrydsningsfelt og få adgang til funktionen, hvilket vil resultere i at få markeret afkrydsningsfelterne eller anvende samme metode med ” Knapper ” for at inkludere to knapper separat til at kontrollere og fjerne markeringen af ​​alle de angivne værdier. Denne opskrivning forklarede metoderne til at markere og fjerne markeringen af ​​alle afkrydsningsfelter ved hjælp af JavaScript.