JavaScript-да change воқеаси

Ушбу дарсликда сиз билан биз киритув майдонларида улгартиришлар бўлганда юзага келадиган change воқеасини ўрганамиз. Бу нимани англатади? Фарз қилайлик, мисол учун, сизда инпут бор ва унда бирон матн бор. Агар сиз шу матнни ўзгартирсангиз, ўша пайтда ана шу воқеа юзага келади.

Келинг, мисолда кўрамиз. Фарз қилайлик, бизда инпут бор:

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

Келинг, унинг ўзгартирилганида консольга унинг янги қийматини чиқарайлик:

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

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

Инпут ва абзац берилган. Инпут ўзгарганида унинг матнини абзацга чиқаринг.

Чекбокс берилган. Чекбокс ўзгарганида экранга унинг янги ҳолатини чиқаринг.

blur ва change воқеалари ўртасидаги фарқ нима эканини сўзланг.

Инпут берилган. Унинг ўзгарганида унинг ичидаги белгилар сони 5-тадан камми-ёки йўқмилигини текширинг. Агар кам бўлса - инпут чеккасини яшил рангга бўянг, агар кўп бўлса - қизил рангга.