JavaScriptда ўзгаришларни бекор қилиш

Баъзан JavaScript ёрдамида тегнинг ўзгаришини бекор қилиш талаб қилинади. Масалан, ҳаволани босганда унга ўтиш бекор қилинса. Оддата, бу ҳаволани биз фақат бирон кодни ишга тушириш учун ишлатаётганимизда талаб қилинади. Бундай ҳолда, ҳаволани босганда унга ўтиб кетилиши биз учун умуман керак эмас.

Ўзгаришни бекор қилиш Event объекти ёрдамида амалга оширилади. Бунинг учун унда preventDefault() номусусус услуб мавжуд, уни ишловчининг istalgan joyida чақириш керак.

Амалиётда синаб кўрамиз. Бизда мана бундай ҳавола бор деб фараз қилайлик:

<a href="/" id="elem">ҳавола</a>

Келинг, ҳаволани босганда бошқа саҳифага ўтиш юз бермаслигини таъминлаймиз:

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

elem.addEventListener('click', function(event) {
	event.preventDefault();
	console.log('Сиз ушбу ҳаволага ўта олмайсиз!');
});

Ҳаволалар берилган. Ҳаволани босганда унга унинг href-и ёзилиб, ҳаволага ўтиш юз бермаслигини таъминланг.

Икки инпут, абзац ва ҳавола берилган. Инпутларга сонлар киритилсин. Ҳаволани босганда абзацга киритилган сонларнинг йиғиндиси ёзилсин.