HTML -form tekstboks

“Et webskjema er den vanligste måten å samle inn nettdata i disse dager. Fra individuelle spørreskjemaer for undersøkelser til enorme markedsføringskampanjer, viser disse nettskjemaene å være en veldig nyttig kilde for å få publikums perspektiv. En viktig komponent i en HTML -skjema er en tekstboks, og i denne artikkelen vil vi lede deg gjennom formålet med dette HTML -elementet, så vel som metoden for å lage tekstbokser i HTML -skjemaer.”

Formålet med en tekstboks i HTML -skjemaer

En tekstboks eller et tekstfelt i en HTML-form brukes til å samle inn tekstdata for enkeltlinjer fra brukeren. Generelt, når du vil gi brukeren din frihet til å legge inn teksten ved å skrive i stedet for ved å velge den fra en forhåndsdefinert liste, bruker du alltid en HTML-tekstboks eller tekstfelt. Følgende avsnitt vil beskrive prosedyren for å lage en tekstboks i en HTML -form.

Opprette tekstbokser i HTML -skjemaer

For å lære å lage tekstbokser i HTML -former, kan du vurdere de to eksemplene som er forklart nedenfor:

Eksempel 1: Opprette enkle tekstbokser i HTML -skjemaer

I dette eksemplet er vårt mål å lage enkle tekstbokser i HTML -skjemaer for å samle inn noen spesifikk informasjon. Vi ønsker imidlertid ikke å ta noen ytterligere tiltak etter det. Vi har designet følgende HTML -skript for å lage enkle tekstbokser innen HTML -skjemaer:

Du kan se at vi i dette skriptet først har gitt en overskrift for å varsle brukeren om formålet med dette HTML -skriptet. Deretter, innenfor "form" -etiketten (siden vi oppretter en HTML -form), har vi definert tre forskjellige tekstbokser med etiketter "Navn", "Age" og "kjønn" for å samle navn, alder og kjønn på brukeren henholdsvis. Alle disse etikettene, så vel som de tilhørende tekstboksene, vises i separate linjer. Brukeren får lov til å legge inn hvilken informasjon han ønsker i disse tekstboksene. Han vil imidlertid ikke kunne iverksette ytterligere tiltak etter å ha lagt inn denne informasjonen.

Da vi utførte HTML -skriptet vårt, vises websiden som dukket opp i nettleseren vår på bildet nedenfor. Denne websiden inneholder alle tre av tekstboksene våre.

Nå står du fritt til å legge inn tilfeldig informasjon i disse tekstboksene, som vist i følgende bilde:

Eksempel 2: Opprette tekstbokser med en handlingsknapp i HTML -skjemaer

I dette eksemplet vil vi endre HTML -skriptet som vi har opprettet ovenfor. Vi ønsker å gjøre denne modifiseringen for å introdusere en handlingsknapp innenfor HTML -skjemaet. Du må se på HTML -skriptet vist nedenfor for å forstå denne modifiseringen:

Dette HTML -skriptet er nesten det samme som vi har delt ovenfor; Før vi lukker "skjemaet" -etiketten, har vi imidlertid opprettet en "send" -knappen i dette skjemaet, slik at brukeren kan trykke på denne knappen etter å ha lagt inn relevant informasjon i skjemaet. Vi har imidlertid ikke opprettet noen handlingsside. Derfor vil ikke klikke på denne knappen navigere deg til noen ny side.

Den endrede websiden i henhold til dette HTML -skriptet vises i følgende bilde:

Nå vil vi legge inn litt informasjon i hver av disse tekstboksene, som vist på bildet nedenfor:

Etter å ha lagt inn denne informasjonen, når vi trykket på "Send" -knappen, endret bare URL -en på websiden vår, og viste navnet, alderen og kjønn som vi nettopp hadde lagt inn. Dette vises i følgende bilde. Etter å ha gjort dette, ble vi ganske enkelt omdirigert til en tom HTML -form siden vi ikke opprettet noen handlingsside i utgangspunktet.

Konklusjon

Denne artikkelen ble skrevet med tanke på behovet for å bruke tekstbokser i HTML -skjemaer. Derfor forklarte det først formålet med dette HTML -elementet, etterfulgt av metoden for å lage tekstbokser i HTML -skjemaer. Når du har lært denne metoden, vil det være et stykke kake for deg å lage så mange tekstbokser i HTML -skjemaene dine etter behov etter behov.