Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Biel.

Exibir elemento que corresponde ao item que foi selecionado

Por , em Javascript

Recommended Posts

Biel.    9

Biel.
Postado
Boa noite a todos. direto ao ponto.

Pessoal abaixo temos três select. O 1º Select você escolhe se quer cadastrar Camisa ou Bermuda.

Após escolher, automaticamente é exibido o 2º e o 3º select. O problema é que exibe os dois de vez.

Gostaria muito que exibisse apenas 1 select; o que corresponde ao produto que foi selecionado.

Nota: Não entendo nada de javascript. O script abaixo peguei na internet.




<html>

<body>

<script type="text/javascript">

function hideandshow(id){ 

if(document.getElementById(id).style.display == 'inline'){ 

document.getElementById(id).style.display = 'none';

}else{

document.getElementById(id).style.display = 'inline';

}

}


function executaEventoOnclick(id){ 

if(document.getElementById(id).style.display == 'inline'){ 

document.getElementById(id).style.display = 'none';

}else{

document.getElementById(id).style.display = 'inline';

}{ 

document.getElementById(id).style.display = 'inline';

}

} 

</script>


</body>

</html>

<!-- Função hideandshow / Function hideandshow  -->

<STYLE type="text/css">

#smasaro{ display: none; }

</style>


<b>Cadastrar: </b>

<select name="aprendiz" onchange="executaEventoOnclick('smasaro')">

<option value=""></option>

                 <option value="">Camisa</option>

                <option value="">Bermuda</option>

</select>


<!-- DIV fica escondida até algum clique no SELECT --> 


<br /><br /><br />


<div id="smasaro">

<!--  select name idmenu tem que ter o mesmo nome para Camisa e Bermuda  -->    

Camisa <select name="idmenu" >  

          <option value=""></option>

          <option value="11">camisa tamanho P</option>

          <option value="12">camisa tamanho M </option>

      </select>


<br><br>


Bermuda <select name="idmenu" > 

          <option value=""></option>

          <option value="24">Bermuda tamanho P</option>

          <option value="25">Bermuda tamanho M </option>

       </select>

</div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Snowden    94

Snowden
Postado

da um Ctrl + C / Ctrl + V 

<!DOCTYPE html>
<html>
<head>
<meta chraset="utf-8" />
<title>teste</title>
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script type="text/javascript">
$(function(){
     $('select[name=opcoes]').change(function(){
	var opcao = $(this).val();
	if( opcao ){
	    var hideOut = opcao == 'opcao1' ? $('#opcao2').hide() : $('#opcao1').hide();
	    $('#'+opcao).show();
	}
     });
});
</script>
</head>
<body>
<div id="select_opcoes">
     <b>Cadastrar: </b>
     <select name="opcoes">
	<option value="">selecione o tipo</option>
	<option value="opcao1">Camisa</option>
	<option value="opcao2">Bermuda</option>
     </select>
</div>     

<div id="opcao1" style="display:none">
     <b>Camisa</b>
     <select name="camisa">  
	<option value="">selecione o tamanho</option>
          <option value="11">camisa tamanho P</option>
          <option value="12">camisa tamanho M </option>
      </select>
</div>

<div id="opcao2" style="display:none">
     <b>Bermuda</b>
     <select name="bermuda"> 
          <option value="">selecione o tamanho</option>
          <option value="24">Bermuda tamanho P</option>
          <option value="25">Bermuda tamanho M </option>
       </select>
</div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Biel.    9

Biel.
Postado

Hugo e gpontes. Muito obrigado. Questão resolvida. Queria muito marcar como resolvido para os dois.

Afinal o objetivo foi atingido. Gpontes o seu codigo obtem um resultado mais interessante. Claro que os dois entende muito bem de javascript, eu que não entendo nada, afinal estou começando. Obrigado para os dois.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito