Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lære Utforsking av Ulike Inputtyper i HTML | HTML-Skjemaer og Brukerinput
Ultimate HTML

bookUtforsking av Ulike Inputtyper i HTML

HTML tilbyr mange <input>-typer som lar deg samle inn ulike typer brukerdata. Nedenfor følger en oversikt over de vanligste typene.

E-post og passord

  • type="email": godtar e-postadresser og utfører grunnleggende validering i nettleseren;
  • type="password": skjuler de inntastede tegnene for sikkerhet og kan bruke minlength og maxlength.
index.html

index.html

copy

Nummer

type="number": godtar numeriske verdier. Bruk min, max og step for å kontrollere tillatt område.

index.html

index.html

copy

Telefon

type="tel": for telefonnumre. Ingen innebygd validering. Utviklere validerer manuelt.

index.html

index.html

copy

Avkrysningsboks

type="checkbox": muliggjør valg av flere alternativer. Bruk checked for å forhåndsvelge.

index.html

index.html

copy

Radio

type="radio": velger ett alternativ fra en gruppe. Alle radio-knapper må ha samme name.

index.html

index.html

copy

Range Slider

type="range": en skyvekontroll for å velge et tall innenfor et område. JavaScript-logikk er utelatt i dette kurset.

index.html

index.html

index.js

index.js

copy
Note
Merk

JavaScript-logikk er utelatt i dette kurset.

Dato og tid

  • type="date": kalendervelger;
  • type="time": tidsvelger;
  • type="datetime-local": kombinerer tid- og datoinndata.
index.html

index.html

copy
Note
Merk

For konsekvent stil, bruker utviklere ofte ferdiglagde UI-biblioteker i stedet for standard nettleservalg.

Note
Les mer

Du har kanskje lagt merke til at når du prøver å fylle ut enkelte felt, kan nettleseren allerede foreslå noen autofyll-alternativer. Nettleseren husker verdiene du har skrevet inn i feltene og foreslår dem deretter for autoutfylling.

question mark

Hva er hovedforskjellen mellom inputfeltene type="email" og type="password"?

Select the correct answer

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 5

Spør AI

expand

Spør AI

ChatGPT

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Suggested prompts:

Can you give examples of how to use each input type in HTML?

What are some best practices for validating user input with these types?

How do I style these input types with CSS?

bookUtforsking av Ulike Inputtyper i HTML

Sveip for å vise menyen

HTML tilbyr mange <input>-typer som lar deg samle inn ulike typer brukerdata. Nedenfor følger en oversikt over de vanligste typene.

E-post og passord

  • type="email": godtar e-postadresser og utfører grunnleggende validering i nettleseren;
  • type="password": skjuler de inntastede tegnene for sikkerhet og kan bruke minlength og maxlength.
index.html

index.html

copy

Nummer

type="number": godtar numeriske verdier. Bruk min, max og step for å kontrollere tillatt område.

index.html

index.html

copy

Telefon

type="tel": for telefonnumre. Ingen innebygd validering. Utviklere validerer manuelt.

index.html

index.html

copy

Avkrysningsboks

type="checkbox": muliggjør valg av flere alternativer. Bruk checked for å forhåndsvelge.

index.html

index.html

copy

Radio

type="radio": velger ett alternativ fra en gruppe. Alle radio-knapper må ha samme name.

index.html

index.html

copy

Range Slider

type="range": en skyvekontroll for å velge et tall innenfor et område. JavaScript-logikk er utelatt i dette kurset.

index.html

index.html

index.js

index.js

copy
Note
Merk

JavaScript-logikk er utelatt i dette kurset.

Dato og tid

  • type="date": kalendervelger;
  • type="time": tidsvelger;
  • type="datetime-local": kombinerer tid- og datoinndata.
index.html

index.html

copy
Note
Merk

For konsekvent stil, bruker utviklere ofte ferdiglagde UI-biblioteker i stedet for standard nettleservalg.

Note
Les mer

Du har kanskje lagt merke til at når du prøver å fylle ut enkelte felt, kan nettleseren allerede foreslå noen autofyll-alternativer. Nettleseren husker verdiene du har skrevet inn i feltene og foreslår dem deretter for autoutfylling.

question mark

Hva er hovedforskjellen mellom inputfeltene type="email" og type="password"?

Select the correct answer

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 5
some-alt