Hoe standaard een keuzerondje selecteren?
Standaard ' gecontroleerd ” attribuut wordt gebruikt voor het selecteren van het keuzerondje. Als dit attribuut op meerdere keuzerondjes wordt gebruikt, wordt standaard het meest recente keuzerondje geselecteerd. Volg de stapsgewijze blog om standaard het keuzerondje te selecteren:
Stap 1: maak keuzerondjes
Maak in het HTML-bestand drie keuzerondjes en voeg er labels aan toe:
< centrum >
< h3 > Selecteer uw ervaringsniveau: < / h3 >
< div >
< invoer type = 'radio' ID kaart = 'beginner' naam = 'ervaring' waarde = 'beginner' >
< etiket voor = 'beginner' > Beginner < / etiket >
< / div >
< div >
< invoer type = 'radio' ID kaart = 'tussenliggend' naam = 'ervaring' waarde = 'tussenliggend' >
< etiket voor = 'tussenliggend' > Tussenliggend < / etiket >
< / div >
< div >
< invoer type = 'radio' ID kaart = 'voorschot' naam = 'ervaring' waarde = 'voorschot' >
< etiket voor = 'voorschot' > Voorschot < / etiket >
< / div >
< / centrum >
In het bovenstaande codefragment:
- Het keuzerondje wordt gevormd door een eenvoudige '
”-tags en het type instellen op “ radio ”. - Wijs aan elk keuzerondje de 'naam', 'id' en 'waarde' toe.
- Gebruik ten slotte de ' ID kaart ' van het invoerveld om de '
' tag met de ' voor ” attribuut.
Na het uitvoeren van het script de uitvoer zoals hieronder:
De afbeelding geeft aan dat de keuzerondjes worden weergegeven, maar geen ervan is standaard geselecteerd.
Stap 2: Selecteer Standaard
De ' gecontroleerd ” attribuut wordt gebruikt om het keuzerondje automatisch te selecteren. Het selecteert slechts één optie. Daarom is het een betere aanpak om standaard één keuzerondje te selecteren. Het beperkt de gebruiker tot het selecteren van de juiste optie:
< div >
< invoer type = 'radio' ID kaart = 'beginner' naam = 'ervaring' waarde = 'beginner' gecontroleerd>
< etiket voor = 'beginner' >Beginner< / etiket >
< / div >
In de bovenstaande code is de gecontroleerd attribuut wordt gebruikt en wordt alleen toegewezen aan het eerste invoerveld.
Nu na het uitvoeren van de bovenstaande code ziet de webpagina er als volgt uit:
De uitvoer illustreert dat het eerste keuzerondje standaard wordt geselecteerd bij elke verversing van de pagina.
Bonustip: JavaScript gebruiken om standaard het keuzerondje te selecteren
Om standaard een keuzerondje te selecteren met behulp van JavaScript, opent u het keuzerondje met behulp van id. Selecteer vervolgens het aangevinkte kenmerk en stel de Booleaanse waarde in op 'true' zoals in de onderstaande code:
< script >document.getElementById ( 'beginner' ) . gecontroleerd = WAAR;
< / script >
In deze code wordt de ' beginner ” is de id van dat keuzerondje dat standaard is geselecteerd.
Na het compileren van het script de uitvoer zoals hieronder:
In de bovenstaande snapshot is het eerste keuzerondje standaard geselecteerd met behulp van JavaScript.
Conclusie
Voor het selecteren van een keuzerondje kunnen gebruikers de ' gecontroleerd ” attribuut. Als het aangevinkte attribuut in meer dan één keuzerondje wordt gebruikt, krijgt het keuzerondje de meest recente 'aangevinkte' attribuutwaarde. Om standaard een keuzerondje te selecteren met behulp van JavaScript, opent u het keuzerondje met behulp van id. Deze blog heeft met succes gedemonstreerd hoe u standaard het keuzerondje kunt selecteren.