Fokusi i fushave të tekstit në JavaScript

Le të kemi një input. Ju mund të klikoni në këtë input dhe pas kësjej në të do të pulsojë kursor-i dhe do të mund të shkruani tekst në të.

Për këtë gjendje thuhet se input-i aktualisht ka fokusin e hyrjes. Në praktikë kjo do të thotë se nëse filloni të shkruani tekst nga tastiera, ai tekst do të shkojë në atë input i cili aktualisht ka fokusin e hyrjes. Nëse pastaj klikoni diku jashtë input-it, ai input do humbasë fokusin e hyrjes dhe në të nuk do të mund të shkruhet tekst.

Për të kapur momentin e marrjes ose humbjes së fokusit nga input-i, në JavaScript parashikohen ngjarje të veçanta: Ngjarja focus lejon të kapet marrja e fokusit nga input-i, ndërsa ngjarja blur - humbja. Le të provojmë në praktikë. Le të kemi një input:

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

Le të marrim një referencë për të në një variabël:

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

Dhe tani le të bëjmë që gjatë marrjes së fokusit të shfaqet në konsol teksti aktual i input-it:

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

Është dhënë një input. Gjatë marrjes së fokusit shkruani në të numrin 1, dhe gjatë humbjes së fokusit - numrin 2.

Është dhënë një input. Le të shkruhet një numër në të. Gjatë humbjes së fokusit shfaqni në ekran katrorin e këtij numri.

Është dhënë një input, në të cilin fillimisht ka një tekst. Gjatë marrjes së fokusit nga input-i, pastrojini përmbajtjen e këtij input-i.