Nummerinngang HTML

Nummerinngang HTML
Noen ganger, mens du oppretter nettformer, har du tenkt å samle inn nummererte data. Det fine med HTML er at det gir dedikerte tagger for å samle inn slike typer data. Nummeren til HTML faller inn under kategorien slike tagger, og i denne artikkelen vil vi prøve å utforske bruken av denne HTML -taggen i dybden.

Hva er nummerinngangskoden i HTML?

Nummerinndatakoden i HTML lar deg oppgi en nummerert inngang. Denne inngangen kan være et hvilket som helst tall, inkludert negative og ikke-negative heltall samt “0”. Nummerinndatakoden i HTML lar deg enten angi den nummererte inngangen via tastaturet eller velge den fra listen gitt av denne taggen. Dessuten har denne taggen også noen andre attributter tilknyttet den som brukes til å tjene forskjellige formål. For eksempel kan du bruke "MIN" og "MAX" -attributtene til nummerinngangskoden for å spesifisere minimum og maksimum inngangsgrense. Tilsvarende kan du bruke "trinn" -attributtet for å spesifisere intervallene for inngang. For å lære mer om hvordan nummerinngangskoden fungerer i HTML, må du gå gjennom de foregående delene av denne artikkelen.

Bruk av nummerinngangskoden i HTML:

For å mestre bruken av nummerinngangskoden i HTML, må du forstå følgende to eksempler:

Eksempel nr. 1: Å legge inn alderen mellom en viss grense:

Vi vil designe dette eksemplet på en slik måte at det vil kunne samle en bruker i en bruker innenfor den spesifiserte grensen. HTML -skriptet som vi har brukt vises på bildet nedenfor:


I dette eksemplet har vi først definert etiketten for vår nummererte inngang, i.e., Alder. Deretter brukte vi tallinngangskoden for å definere aldersgrensen, som vi holdt mellom 15 og 30. Det betyr at dette HTML -skriptet vil be brukeren om å gå inn i alderen, men den alderen må begrenses mellom 15 og 30. Vi har også lagt til en innsendingsknapp til dette skriptet for å få det til å se mer presentabel.

Etter å ha utført HTML -skriptet som er vist ovenfor, ble følgende webside vist i nettleseren vår. Du kan se at vi har fått et antall inngangsfelt der vi enten kan skrive et bestemt tall som ligger innenfor det spesifiserte området med tastaturet vårt, eller vi kan til og med bruke piltastene tilknyttet antall inngangsfelt for å velge ønsket alder.


Bildet vist nedenfor representerer en tilfeldig valgt alder:


Siden minimumsalderen er 15, vil vi verken kunne skrive noe under den eller være i stand til å velge et nummer under 15 ved å bruke pilene. Når vi har nådd minimumsaldergrensen, vil dette tallet automatisk bli fremhevet som vist i følgende bilde, noe som indikerer at vi ikke kan bevege oss under denne aldersgrensen.


Tilsvarende vil vi heller ikke få lov til å gå utover den maksimale aldersgrensen, som er "30" i dette tilfellet. Dette er avbildet i bildet vist nedenfor:

Eksempel 2: Å legge inn antall epler med et spesifisert intervall:

I dette eksemplet vil vi introdusere deg for en ny attributt tilknyttet nummerinngangskoden til HTML, I.e., trinnsattributtet. Denne attributtet brukes til å spesifisere intervallene du vil øke eller redusere den nummererte inngangen. For å gjøre det, har vi skrevet følgende HTML -skript:


I dette eksemplet ønsket vi at brukeren skulle legge inn antall epler han/hun ønsket i kilo i multipler av “2”, i.e., Han/hun kan komme inn 2, 4, 6, 8, og så videre. For å oppnå denne funksjonaliteten har vi spesifisert "trinn" -attributtet med inngangstypen og har holdt verdien som "2".

Da vi utførte dette skriptet, ble vi presentert for websiden vist på bildet nedenfor:


Følgende bilde viser at vi har valgt 6 kilo epler:


I dette eksemplet definerte vi imidlertid ikke noen nedre eller øvre grense på grunn av muligheten for at brukeren kan ende opp med å velge et negativt tall (som teknisk sett ville være ugyldig), som vist på bildet nedenfor:


For å forhindre at dette skjer, vil vi endre skriptet ovenfor ved å benytte deg av "Min" -attributtet for å spesifisere at minimumsmengden av epler ikke kan være mindre enn 2 kilo som vist i følgende bilde:


Da vi utførte HTML -skriptet etter å ha gjort denne modifiseringen, fikk vi ikke lov til å gå under 2 kilo, som vist på bildet nedenfor:

Konklusjon:

Gjennom denne artikkelen ønsket vi å formidle bruken av nummerinngangstaggen Oin HTML til leserne våre. Vi utviklet først en grunnleggende forståelse av denne taggen ved å diskutere noen av attributtene knyttet til den. Etter det forklarte vi bruken av denne taggen ved hjelp av to relevante eksempler. Når du har gått gjennom denne guiden, vil du tydelig forstå hvordan nummerinngangskoden fungerer i HTML.