Olá, tenho um projeto, e preciso que, ao selecionar determinado item em um select, apareça(ou não) outros itens, me parece bem simples, mas me surpreendi pela dificuldade que estou tendo ao fazê-lo, eis o que tenho testado até o momento:
Selecione um carro da lista<br>
<select id="mySelect" onchange="myFunction()">
<option value="Audi">Audi
<option value="BMW">BMW
<option value="Mercedes">Mercedes
<option value="Volvo">Volvo
</select><br><br>
<div id="modelo" style="display:none;">Escolha um modelo<br><select>
<option value="x1">x1</option>
<option value="x2">x2</option>
<option value="x3">x3</option>
<option value="x4">x4</option>
</select></div>
<script>
function myFunction() {
var x = document.getElementById("mySelect").value;
if x.value == ("BMW"){
document.getElementById("modelo").style.display = 'block';
}
}
</script>
Basicamente, ele deveria, quando selecionada a marca BMW
, mudar o status do estilo display da div modelo, mas não funciona.