Das change-Ereignis in JavaScript

In dieser Lektion werden wir gemeinsam das Ereignis change besprechen, das in Eingabefeldern bei deren Änderung auftritt. Was bedeutet das? Nehmen wir an, Sie haben ein Input-Feld und darin befindet sich irgendein Text. Wenn Sie diesen Text ändern, dann tritt in diesem Fall dieses Ereignis auf.

Schauen wir uns ein Beispiel an. Nehmen wir an, wir haben ein Input-Feld:

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

Lassen Sie uns bei seiner Änderung den neuen Wert in der Konsole ausgeben:

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

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

Gegeben sind ein Input-Feld und ein Absatz. Geben Sie bei Änderung des Input-Felds dessen Text in den Absatz aus.

Gegeben ist eine Checkbox. Geben Sie bei Änderung der Checkbox deren neuen Zustand auf dem Bildschirm aus.

Erklären Sie, worin der Unterschied zwischen den Ereignissen blur und change liegt.

Gegeben ist ein Input-Feld. Prüfen Sie bei dessen Änderung, ob die Anzahl der Zeichen darin weniger als 5 beträgt oder nicht. Wenn weniger - färben Sie den Rand des Input-Felds grün, und wenn mehr - rot.