Тушурилган рўйхат пунктининг рақами

Селектларда selectedIndex деб аталувчи махсус хусусият мавжуд бўлиб, у ҳозир танланган рўйхат пунктининг рақамини сақлайди. Рақамлаш бунда нолдан бошланади. Бундан ташқари, бу хусусиятни ҳам ўқиш мумкин, ҳам ёзиш мумкин, рўйхатнинг танланган пунктини ўзгартириш орқали.

Келинг, бу хусусият билан ишлашни мисолда кўриб чиқайлик. Бизда куйидаги тушурилган рўйхат мавжуд деб фараз қилайлик:

<select id="select">
	<option value="one">бир</option>
	<option value="two" selected>икки</option>
	<option value="three">уч</option>
</select>

Келинг, танланган рўйхат пунктининг рақамини чиқариб кўрсатамиз:

let select = document.querySelector('#select');
console.log(select.selectedIndex); // 1 ни кўрсатади

Энди esa бошқа бир пунктни танлаймиз:

let select = document.querySelector('#select');
select.selectedIndex = 2; // 'уч' ни танлайди

Инпут ва селект берилган. Инпутга қандайдир рақам киритилган. Фокус йўқотилганда, инпутдаги қийматга тенг рақамли рўйхат пунктини танланган қилиб тақинг.

Ҳафта кунлари номлари билан тушурилган рўйхат яратинг. JavaScript орқали ушбу рўйхатда сунгги кун автоматик равищда танланса қилинг.