Nolaižamo sarakstu apstrāde JavaScript

Šajā nodarbībā mēs pētīsim darbu ar atlasīšanas elementu select, kas ir nolaižams saraksts. Ja jūs neprotat strādāt ar šo elementu HTML, tad vispirms apgūstiet tā ierīkojumu atsauces grāmatā šeit: select.

Apskatīsim, kā strādāt ar šo elementu caur JavaScript. Pieņemsim, ka mums ir dots šāds nolaižams saraksts:

html<select id="select">
  <option>one</option>
  <option selected>two</option>
  <option>three</option>
</select>

Iegūstam atsauci uz selektu mainīgajā:

javascriptlet select = document.querySelector('#select');

Tagad, mainoties selektam, izvadīsim ekrānā atlasītā saraksta punkta tekstu. Lai to izdarītu, ir jānolasa value īpašība mūsu selektam:

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