Tenho esta caixa de seleção:
<select id="valores_confinamento" class ="form-control">
<option value="ceu" >Ceu aberto</option>
<option value="galpao" selected>Galpão fechado</option>
</select>
E gostaria que quando selecionado fosse possível alterar o valor em:
<div style="top: 95%; left: 34%;position: absolute">
<span id="id_area_piquete_por_animais" ></span>
</div>
Eu fiz:
var selection = document.getElementById("valores_confinamento");
var selected = selection.options[selection.selectedIndex].text;
function valor(){
if (selected =="ceu" ){
document.getElementById("id_area_piquete_por_animais").innerHTML=10;
}
if (selected =="galpao" ){
document.getElementById("id_area_piquete_por_animais").innerHTML=20;
}
}
valor();
selection.addEventListener("keyup",valor);
selected .addEventListener("keyup",valor);
Mas não retorna o algo.