Denne artikkelen vil demonstrere metodene for å merke av og fjerne merket for alle avmerkingsbokser ved hjelp av JavaScript.
Hvordan sjekke og fjerne merket for alle avmerkingsbokser ved hjelp av JavaScript?
For å merke av og fjerne merket for alle avmerkingsbokser i JavaScript, kan du bruke:
- ' document.getElementsByName ”-metoden med avmerkingsbokser
- ' document.getElementsByName ” metode med knapper
De nevnte tilnærmingene vil nå bli diskutert én etter én!
Metode 1: Merk av og fjern merket for alle avmerkingsbokser i JavaScript ved å bruke 'document.getElementsByName()'-metoden med 'Checkboxes'
« document.getElementsByName() ”-metoden returnerer elementene med det angitte navnet i argumentene. Denne metoden vil bli brukt for å hente verdien av hver avmerkingsboks ved hjelp av det beståtte navnet.
La oss gå gjennom følgende eksempel for demonstrasjon.
Eksempel
Først vil inndatatypen bli spesifisert som ' avmerkingsboksen ' og et spesifikt navn og verdi vil bli tildelt for hver avmerkingsboks:
< inndatatype = 'avmerkingsboks' Navn = 'bare' verdi = 'Python' > Python < br />< inndatatype = 'avmerkingsboks' Navn = 'bare' verdi = 'Java' > Java < br />
< inndatatype = 'avmerkingsboks' Navn = 'bare' verdi = 'JavaScript' > JavaScript < br />
Ta med en ekstra avmerkingsboks med verdien ' Sjekk alt ' og legg ved en ' ved trykk() '-hendelse med denne avkrysningsboksen som vil fungere på en slik måte når avkrysningsboksen vil bli klikket, ' sjekk Ikke merket ()'-metoden vil bli påkalt med objektet ' dette ' som argument:
< inndatatype = 'avmerkingsboks' ved trykk = 'checkUncheck (this)' /> Sjekk alt < br />
Etter det, definer en funksjon kalt ' sjekkUncheck() ' i JavaScript-filen, med en variabel kalt ' avkrysningsboks ' som et argument. Nå får du tilgang til avkrysningsboksverdiene ved å bruke ' document.getElementsByName() '-metoden og plasser verdien av ' Navn ”-attributt som argument.
Til slutt, bruk en ' til '-løkke for å iterere langs alle avkrysningsboksverdiene og bruke ' sjekket ' egenskap for å merke dem alle som avmerket:
funksjonssjekk Fjern merket ( avkrysningsboks ) {få = dokument. getElementsByName ( 'bare' ) ;
til ( var i = 0 ; Jeg < få. lengde ; Jeg ++ ) {
få [ Jeg ] . sjekket = avkrysningsboks. sjekket ; }
}
Som du kan se, når ' Sjekk alt ” avmerkingsboksen er merket, alle de andre avmerkingsboksene er også merket som avkrysset:
Metode 2: Merk av og fjern merket for alle avmerkingsbokser i JavaScript ved å bruke 'document.getElementsByName()'-metoden med 'knapper'
« document.getElementsByName() ”-metoden, som diskutert i forrige metode, henter elementene med det angitte navnet i argumentene. Den kan brukes til å merke av eller fjerne merket for alle de tilføyde avmerkingsboksene på en nettside.
Se på følgende eksempel for demonstrasjon.
Eksempel
Nå vil vi inkludere to knapper for både ' Sjekker alle ' og ' Fjern merket for Alle ' funksjoner. Deretter legger du ved en ' ved trykk ” hendelse med begge knappene som vil få tilgang til de angitte funksjonene separat:
< inndatatype = 'knapp' ved trykk = 'kryss av()' verdi = 'Sjekker alle' />< inndatatype = 'knapp' ved trykk = 'unCheck()' verdi = 'Fjerner merket for alle' />
Definer deretter en funksjon kalt ' kryss av() ' og bruk ' document.getElementsByName '-metoden med den angitte verdien av ' Navn ' Egenskap. Deretter gjentar du ' til ” løkke langs alle avkrysningsboksverdiene diskutert i forrige metode.
Dessuten, når den tilknyttede knappen klikkes, vil ' sjekket '-egenskapen vil merke alle avmerkingsboksene og sette den avmerkede tilstanden som ' ekte ':
funksjonssjekk ( ) {være geit = dokument. getElementsByName ( 'kryss av' ) ;
til ( var i = 0 ; Jeg < få. lengde ; Jeg ++ ) {
få [ Jeg ] . sjekket = ekte ; }
}
Definer deretter en funksjon kalt ' fjern merket () ', og legg til den omvendte funksjonaliteten i den for å merke avkrysningsboksen egenskapen som ' falsk ':
funksjon fjern merket ( ) {være geit = dokument. getElementsByName ( 'kryss av' ) ;
til ( var i = 0 ; Jeg < få. lengde ; Jeg ++ ) {
få [ Jeg ] . sjekket = falsk ; }
}
Det kan se i utgangen at de ekstra knappene fungerer perfekt:
Vi har gitt de enkleste metodene for å merke av og fjerne merket for alle avmerkingsbokser ved hjelp av JavaScript.
Konklusjon
For å merke av og fjerne merket for alle avmerkingsboksene ved bruk av JavaScript, bruk ' document.getElementsByName() ' metode med ' Avmerkingsbokser ” for å legge til en avkrysningsboks og få tilgang til funksjonen, noe som vil resultere i å få merket av i avmerkingsboksene eller bruke samme metode med “ Knapper ” for å inkludere to knapper separat for å sjekke og fjerne merket for alle de angitte verdiene. Denne oppskriften forklarte metodene for å merke av og fjerne merket for alle avmerkingsboksene ved hjelp av JavaScript.