Pagina 1 din 1

Afisare optiune selectata intr-un Div

Scris: Mie Noi 25, 2020
de Marius
Cum pot face ca atunci cand e selectata o optiune dintr-o lista <select> sa fie afisata intr-un Div valoarea acelei optiuni.
Am acest cod html, cu lista de optiuni si tag-ul Div:

Cod: SelectaĊ£i tot

<select id='drink'>
  <option value=''>Which drink would you like?</option>
  <option>Latte</option>
  <option>Capuccino</option>
  <option>Americano</option>
  <option>Tea</option>
</select>
<div id='output'></div>

Afisare optiune selectata intr-un Div

Scris: Mie Noi 25, 2020
de MarPlo
Cu JavaScript adaugi un eveniment 'change' la elementul <select> care se va declansa cand o optiune e selectata.
In interiorul acelui eveniment folosesti 'this.value' ca sa preiei valoarea selectata, apoi cu 'innerText' o adaugi in Div.

Cod: SelectaĊ£i tot

Select an option: 
<select id='drink'>
  <option value=''>Which drink would you like?</option>
  <option>Latte</option>
  <option>Capuccino</option>
  <option>Americano</option>
  <option>Tea</option>
</select>
<div id='output'></div>

<script>
var drinkSelect = document.getElementById('drink');
var outputDiv = document.getElementById('output');
drinkSelect.addEventListener('change',function(){
  output.innerText = 'You like '+ this.value;
})
</script>
- Demo:
Select an option: