Izvēlētā saraksta punkta maiņa ar JavaScript

Iepriekšējā nodarbībā mēs iemācījāmies iegūt izvēlēto saraksta punktu. Tagad mainīsim izvēlēto punktu, izmantojot JavaScript.

Lai to izdarītu, selektā value īpašībā ierakstīsim tā option value atribūta vērtību, kuru vēlamies izvēlēties.

Pieņemsim, ka mums ir šāds selekts:

<select id="select">
	<option value="one">viens</option>
	<option value="two" selected>divi</option>
	<option value="three">trīs</option>
</select>

Pieņemsim, ka ir arī poga:

<input type="submit" id="button">

Iegūsim saites uz selektu un pogu mainīgajos:

let select = document.querySelector('#select');
let button = document.querySelector('#button');

Un tagad darīsim tā, lai, noklikšķinot uz pogas, mūsu selekts mainītu izvēli:

button.addEventListener('click', function() {
	select.value = 'one';
});

Ja mūsu sarakstam nav value atribūtu, tad selekta value īpašībā ir jāieraksta tā option atvēršanas un aizvēršanas tagu teksts, kuru mēs vēlamies izvēlēties.

Izveidojiet nolaižamo sarakstu ar mēnešu nosaukumiem. Iestatiet tā, lai JavaScript pēc noklusējuma šajā sarakstā izvēlētos pašreizējo mēnesi.