Notikums change JavaScript

Šajā nodarbībā mēs ar jums analizēsim notikumu change, kas rodas ievades laukos to izmaiņu brīdī. Ko tas nozīmē? Pieņemsim, ka, piemēram, jums ir ievades lauks un tajā ir kāds teksts. Ja jūs mainīsiet šo tekstu, tad šajā gadījumā radīsies šis notikums.

Apskatīsim to ar piemēru. Pieņemsim, ka mums ir ievades lauks:

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

Kad tā vērtība mainās, izvadīsim konsolē tā jauno vērtību:

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

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

Dots ievades lauks un rindkopa. Kad ievades lauka vērtība mainās, izvadiet tā tekstu rindkopā.

Dots atzīmēšanas rūtiņa. Kad atzīmēšanas rūtiņas stāvoklis mainās, izvadiet ekrānā tā jauno stāvokli.

Paskaidrojiet, kāda ir atšķirība starp notikumiem blur un change.

Dots ievades lauks. Kad tā vērtība mainās, pārbaudiet, vai simbolu skaits tajā ir mazāks par 5 vai nē. Ja mazāks - iekrāsojiet ievades lauka apmali zaļā krāsā, ja vairāk - sarkanā.