New(ish) i HTML5

autocomplete attributtet ble innført som en uoffisiell HTML-funksjonen i Microsoft Internet Explorer, og ble adoptert av en rekke andre nettlesere. Så det har vært bred støtte for det for lang tid, selv om den eksakte virkemåten var ikke standardisert. Med HTML5, autocomplete attributt er en offisiell del av spesifikasjonen.,

autofullfør vs. liste & <datalist>

autocomplete attributt ber leseren til å forsøke automatisk fullføring, basert på brukerens historie. Dette er nyttig for personlige opplysninger som navn og e-postadresse — ting brukeren er sannsynlig å ha typene i lignende felter på andre nettsteder. autocomplete funksjonen er ikke i stand til å gi leseren en liste med stedsspesifikke autofullfør valg., For autofullfør atferd med site-spesifikke forslag, bruk list attributt med <datalist> – element.

Bevisst «brutt»

Alle de store nettleserne ignorere autocomplete="off" verdi for visse typer av feltene. Internet Explorer og Edge ignorere det for alle password felt. Firefox ignorerer det for alle felt i et innloggingsskjema. Chrome ignorerer det noen gang brukeren har valgt å la nettleseren huske form data. Safari ignorerer det for brukernavn, e-post og passord feltene., Ignorerer autocomplete="off" verdi er gjort for å forbedre brukervennlighet, og gve brukeren mer kontroll over autofullfør atferd. Som UX-designer, du bør følge sin leder og bruk autocomplete="off" sparsomt. Det er svært få tilfeller i normale former der det virkelig er fornuftig å forby autocomplete. I noen komplekse programmer, er det fornuftig å unngå utilsiktet innganger, men med de fleste vanlige former er det egentlig ingen grunn til det.,

Autofullfør og navn

Nettlesere bruker name attributtet for å finne ut hva slags informasjon som en input-feltet er å be om. Så bruk standard, meningsfylte verdier for name., Hvis du spør etter en adresse, kan du bruke navn som:

  • address-1
  • address-2
  • city
  • state eller province
  • zip eller postal-code

ikke bruke smart eller merkelig spesifikke navn, som gjør det vanskeligere for leseren å gi autofullfør forslag, og det kan også føre til leseren prøver å fylle inn feil verdier i feil signaler., (Har du noen gang hatt nettleseren fylle ditt telefonnummer inn postnummeret feltet? Det var feil av dårlig navn.)

Verdier av autofullfør-Attributt

– Verdi Navn Notater
av Slår autofullfør av.
Slår autofullfør på.,

Alle Attributter av input-Elementet

– Attributtet navn – Verdier Notater
trinn Angir intervallet mellom gyldige verdier i en tall-baserte innspill.
som er nødvendig Angir at feltet er påkrevet; forbyr form innsending og varsler brukeren om nødvendig feltet er tomt.
plassholder Angir plassholder for tekst i en tekst-basert inngang.,
mønster Angir et vanlig uttrykk mot å validere verdien av input.
flere Tillater brukeren å legge inn flere verdier i en fil, laste opp, eller på e-post inngang.
min Angir en minimum verdi for antall og dato-feltene.
maks. Angir en maksimal verdi for antall og dato-feltene.,
liste Angir id for en <datalist> – element som inneholder en liste over autofullfør-forslag for innspill felt.
høyde Angir høyden av et bilde input.
formtarget Angir du surfer sammenhengen som å åpne svar fra serveren etter at skjemaet er sendt inn. Kun For bruk på input-typer «send» eller «image».,
formmethod Angi HTTP-metode (GET eller POST) skal brukes når skjema er sendt til serveren. Kun for bruk på input-typer «send» eller «image».
formenctype Angir hvordan skjema skal sendes til serveren. Kun for bruk på input-typer «send» og «image».
formaction Angir URL-adresse for innsending av skjemaer. Kan bare brukes for type=»submit» og skriv inn=»bilde».
skjema Angir en form som input-feltet tilhører.,
autofokus Angir at feltet skal være i fokus umiddelbart når siden lastes.
accesskey Definerer en hurtigtast for elementet.
autofullfør av
Angir om nettleseren skal forsøke å automatisk fullføre innspill basert på brukerens input til lignende felt.
grensen Ble brukt til å angi en ramme på en inngang. Ugyldige. Bruk CSS i stedet.,
checked Angir om en avmerkingsboks eller radio-knappen form innspill bør være merket av som standard.
deaktivert Deaktiverer input-feltet.
maxlength Angir maksimalt antall tegn som kan skrives inn i en tekst-type input.
språk Ble brukt til å indikere programmeringsspråket som brukes for hendelser som utløses ved inngang.
navn – Angir navnet på en input-elementet., Navnet og verdien av hver input-elementet er inkludert i HTTP-forespørselen når skjemaet er sendt.
size Angir bredden av input i tegn.
kilde Definerer kilde URL til et bilde input.
type button
checkbox
file
hidden
image
password
radio
reset
submit
text
Definerer input type.
verdi Definerer en opprinnelig verdi eller standard valg for et tekstfelt.,
Adam is a technical writer who specializes in developer documentation and tutorials.