Hvordan lage en inngangsboks i JavaScript?

JavaScript er et av verdens mest kjente programmeringsspråk som hjelper til med å lage dynamiske og interaktive webapplikasjoner. Som alle andre dynamiske språk er det en nødvendighet å lese, lagre, behandle og sende ut data fra en bruker.

Når du trenger å håndtere brukerdata uten å sende dem tilbake til serveren, er JavaScript ekstremt gunstig. JavaScript er betydelig raskere enn å sende alt til serveren som skal behandles, men du må kunne motta brukerinngang og operere med den ved hjelp av riktig syntaks. Fokus for denne opplæringen vil være å skaffe brukerinngang og vise den på skjermen ved hjelp av HTML -elementer eller spørsmål.

Metode 1: Bruke spørsmål

For å få kontakt med brukere, tilbyr JavaScript oss noen få vindusobjektmetoder som en er spør () metode. Den grunnleggende funksjonen til metoden for spurt () er å vise en dialogboks og ta innspill fra en bruker. De spør () Metoden brukes ofte til å lagre/lagre små mengder informasjon om brukeren og brukes oftest når utvikleren ønsker at brukeren skal legge inn data før han fortsetter til websiden.

Syntaks

spør (tekst, standard)

De spør () Metoden tar to parametere: den første er tekst parameter, som vises i dialogboksen, og den andre er den misligholde Parameter, som er standardteksten som vises i Prompt's Input Box. Disse alternativene er begge valgfrie og kan være tomme.

hurtig () Metodeeksempel

var name = spurt ("Enter Your Name", "Enter Name");
hvis (navn != null)
Varsel ("Hei! "+ navn)

I ovennevnte JavaScript -kode kalte vi spør () metode og ba brukeren om å legge inn navnet hans. Standardverdien vil være Skriv inn navn:

La oss fjerne ENTER -navnet og skriv inn navnet ditt:

Nå når du klikker på Ok knappen du vil se Hallo! Nas Meldingsvarsling:

Metode 2: HTML og JavaScript

En annen metode for å lage en inngangsboks i JavaScript er å bruke en HTML -inngangsboks og deretter referere til det i JavaScript og få sin verdi.

Html:

Lag inngangsboks

Lagre

I koden ovenfor definerte vi en inngangsboks og deretter en knapp med anime til Lagre. Vi refererte da til kode.JS Fil ved hjelp av skriptetoden. I kode.JS fil, all vår JavaScript -kode vil være til stede.

JavaScript:

const btn = dokument.getElementById ("BTN");
btn.AddEventListener ('klikk', funksjon ()
var navn = dokument.getElementById ("Myname").verdi;
Varsel ("Navn:"+ Navn);
);

I koden ovenfor henviste vi til knappen med IDen til btn Fra HTML og la deretter til en hendelseslytter av klikk til den som vil lytte kontinuerlig, og når noen klikker på lagringsknappen vil en funksjon kjøres. I denne funksjonen får vi først verdien av inngangsboksen ved å bruke ID -en som er gitt til den som er mitt navn. Så varsler vi denne verdien.

Konklusjon

JavaScript er programmeringsspråket hvis fellesskap øker dag for dag og med rette, da det er programmeringsspråket som gjør vår webside interaktiv. JavaScript tilbyr oss å samhandle med brukerne ved å ta innspill fra brukeren og deretter lagre den inngangen eller vise denne inngangen.

I denne artikkelen tok vi innspill fra brukeren og viste den inngangen ved hjelp av to metoder I-E spør () Metode og referanse en inngangsboks fra HTML i JavaScript.