Fokus på tekstfelt i JavaScript

La oss si at vi har et input-felt. Du kan klikke på dette input-feltet, og etter det vil en blinkende strekmarkør dukke opp, og du vil kunne skrive tekst inn i det.

Om en slik tilstand sier man at input-feltet for øyeblikket har inndatafokus. I praksis betyr dette at hvis du begynner å skrive tekst fra tastaturet, vil denne teksten havne i det input-feltet som for øyeblikket har inndatafokus. Hvis du deretter klikker et sted utenfor input-feltet, vil dette input-feltet miste inndatafokus og det vil ikke være mulig å skrive tekst inn i det.

For å fange øyeblikket når et input-felt får eller mister fokus, er det i JavaScript laget spesielle hendelser: Hendelsen focus later deg fange når et input-felt får fokus, og hendelsen blur - når det mister det. La oss prøve i praksis. La oss si at vi har et input-felt:

html<input id="elem" value="text">

La oss henvisning til det i en variabel:

javascriptlet elem = document.querySelector('#elem');

Og nå la oss gjøre slik at når det får fokus, skrives den nåværende teksten i input-feltet ut til konsollen:

javascriptelem.addEventListener('focus', function() {
  console.log(elem.value);
});