Šajā rakstā tiks parādītas metodes, kā pārbaudīt un noņemt visas izvēles rūtiņas, izmantojot JavaScript.
Kā atzīmēt un noņemt atzīmi no visām izvēles rūtiņām, izmantojot JavaScript?
Lai pārlūkprogrammā JavaScript atzīmētu visas izvēles rūtiņas un noņemtu atzīmes, varat lietot:
- ' document.getElementsByName ” metodi ar izvēles rūtiņām
- ' document.getElementsByName ” metode ar pogām
Minētās pieejas tagad tiks apspriestas pa vienai!
1. metode: atzīmējiet visas izvēles rūtiņas un noņemiet atzīmi no tām JavaScript, izmantojot metodi “document.getElementsByName()” ar “Checkboxes”
' document.getElementsByName() ” metode atgriež elementus ar norādīto nosaukumu savos argumentos. Šī metode tiks izmantota, lai iegūtu katras izvēles rūtiņas vērtību, izmantojot nodoto nosaukumu.
Demonstrēšanai apskatīsim šādu piemēru.
Piemērs
Pirmkārt, ievades veids tiks norādīts kā ' izvēles rūtiņa ” un katrai izvēles rūtiņai tiks piešķirts konkrēts nosaukums un vērtība:
< ievades veids = 'izvēles rūtiņa' nosaukums = 'tikai' vērtību = 'Pitons' > Python < br />< ievades veids = 'izvēles rūtiņa' nosaukums = 'tikai' vērtību = 'Java' > Java < br />
< ievades veids = 'izvēles rūtiņa' nosaukums = 'tikai' vērtību = 'JavaScript' > JavaScript < br />
Tagad iekļaujiet papildu izvēles rūtiņu ar vērtību ' Pārbaudi visu ' un pievienojiet ' onclick () ” notikumu ar šo izvēles rūtiņu, kas darbosies tādā veidā, kad tiks noklikšķināta uz izvēles rūtiņas, checkNeatzīmēts ()' metode tiks izsaukta ar objektu ' šis ” kā argumentu:
< ievades veids = 'izvēles rūtiņa' onclick = 'checkUncheck(this)' /> Pārbaudi visu < br />
Pēc tam definējiet funkciju ar nosaukumu ' checkUncheck() ' JavaScript failā ar mainīgo nosaukumu ' izvēles rūtiņa ” kā argumentu. Tagad piekļūstiet izvēles rūtiņas vērtībām, izmantojot “ document.getElementsByName() ' metodi un ievietojiet '' vērtību nosaukums ” kā argumentu.
Visbeidzot, izmantojiet ' priekš ' cilpa, lai atkārtotu visas izvēles rūtiņas vērtības un izmantotu ' pārbaudīts ” rekvizītu, lai tos visus atzīmētu kā atzīmētus:
funkciju pārbaude Noņemiet atzīmi ( izvēles rūtiņa ) {gūt = dokumentu. getElementsByName ( 'tikai' ) ;
priekš ( bija iekšā = 0 ; i < gūt. garums ; i ++ ) {
gūt [ i ] . pārbaudīts = izvēles rūtiņa. pārbaudīts ; }
}
Kā redzat, kad “ Pārbaudi visu ” ir atzīmēta izvēles rūtiņa, visas pārējās izvēles rūtiņas arī ir atzīmētas kā atzīmētas:
2. metode: atzīmējiet un noņemiet atzīmi no visām izvēles rūtiņām programmā JavaScript, izmantojot metodi “document.getElementsByName()” ar “pogām”
' document.getElementsByName() ” metode, kā aprakstīts iepriekšējā metodē, ienes argumentos elementus ar norādīto nosaukumu. To var izmantot, lai atzīmētu vai noņemtu atzīmes no visām pievienotajām izvēles rūtiņām tīmekļa lapā.
Demonstrēšanai skatiet tālāk redzamo piemēru.
Piemērs
Tagad mēs iekļausim divas pogas abām “ Pārbauda visu ' un ' Noņemiet atzīmi no izvēles rūtiņas Visas ” funkcionalitātes. Pēc tam pievienojiet ' onclick ” notikumu ar abām pogām, kas atsevišķi piekļūs norādītajām funkcijām:
< ievades veids = 'poga' onclick = 'check()' vērtību = 'Pārbauda visu' />< ievades veids = 'poga' onclick = 'uncheck()' vērtību = 'Noņem atzīmes visu' />
Pēc tam definējiet funkciju ar nosaukumu ' pārbaudīt () ” un piemēro „ document.getElementsByName ” metode ar norādīto vērtību nosaukums ” atribūts. Pēc tam atkārtojiet “ priekš ” cilpu pa visām izvēles rūtiņu vērtībām, kas tika apspriestas iepriekšējā metodē.
Turklāt, noklikšķinot uz saistītās pogas, parādās “ pārbaudīts ' rekvizīts atzīmēs visas izvēles rūtiņas un iestatīs atzīmēto stāvokli kā ' taisnība ”:
funkciju pārbaude ( ) {esi kaza = dokumentu. getElementsByName ( 'pārbaudīt' ) ;
priekš ( bija iekšā = 0 ; i < gūt. garums ; i ++ ) {
gūt [ i ] . pārbaudīts = taisnība ; }
}
Pēc tam definējiet funkciju ar nosaukumu ' noņemt atzīmi () ”, un pievienojiet tai apgriezto funkcionalitāti, lai atzīmētu izvēles rūtiņas rekvizītu kā “ viltus ”:
funkcija noņemiet atzīmi ( ) {esi kaza = dokumentu. getElementsByName ( 'pārbaudīt' ) ;
priekš ( bija iekšā = 0 ; i < gūt. garums ; i ++ ) {
gūt [ i ] . pārbaudīts = viltus ; }
}
Izvadā var redzēt, ka pievienotās pogas darbojas nevainojami:
Mēs esam nodrošinājuši vienkāršākos veidus, kā pārbaudīt un noņemt atzīmes visām izvēles rūtiņām, izmantojot JavaScript.
Secinājums
Lai atzīmētu visas izvēles rūtiņas un noņemtu tās, izmantojot JavaScript, izmantojiet “ document.getElementsByName() ' metode ar ' izvēles rūtiņas ”, lai pievienotu izvēles rūtiņu un piekļūtu funkcijai, kā rezultātā tiks atzīmētas izvēles rūtiņas vai lietotu to pašu metodi ar “ Pogas ”, lai atsevišķi iekļautu divas pogas visu norādīto vērtību pārbaudei un atzīmes noņemšanai. Šajā rakstā ir izskaidrotas metodes, kā pārbaudīt un noņemt visas izvēles rūtiņas, izmantojot JavaScript.