Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Preciso exibir conteúdo de acordo com a opção selecionada em um select, porém as informações não estão sendo carregadas.
Segue código:
html: a Seleção
<select name="form" class="form-control m-input" onchange="return itemSelect">
<option value="">Selecione o tipo...</option>
<option value="1">Opção 1</option>
<option value="2">Opção 2</option>
</select>
html: divs
<div class="opcao-1"> //Div esta com style:none//Conteudo.
</div>
<div class="opcao-2"> //Div esta com style:none//
Conteudo
</div>
JS:
<script type="text/javascript">
function itemSelect(elem) {
$('.doc').hide();
var ind = $(elem).val();
switch (ind) {
case '1':
$('.opcao-1').fadeIn();
break;
case '2':
$('.opcao-2').fadeIn();
break;
}
}
</script>
Ao selecionar o item 1, ele exibe o conteúdo da DIV selecionada, porém se seleciono a opção 2, o conteúdo da opção 1 continua sendo exibida. Gostaria de ter a ajuda de vocês para saber o que estou fazendo de errado, sou muito ruim com JS, se puderem também me arrumar conteúdo para estudos fico grato.>
15 minutos atrás, Marcos_imasters disse:
onchange="return itemSelect(this)"
Oi Marcos, obrigado por tentar ajudar com meu problema. Eu na verdade já tinha havia tentado esta solução, e o resultado foi o mesmo. Ele continua mostrando os conteúdos de ambas as divs simultaneamente, quando escolha a opção 1 e depois seleciono a opção 2.
Eu quero mostrar apenas uma delas por vez.>
22 minutos atrás, Guga Alves disse:
Oi Marcos, obrigado por tentar ajudar com meu problema. Eu na verdade já tinha havia tentado esta solução, e o resultado foi o mesmo. Ele continua mostrando os conteúdos de ambas as divs simultaneamente, quando escolha a opção 1 e depois seleciono a opção 2.
Eu quero mostrar apenas uma delas por vez.
https://jsfiddle.net/aurasistemas/gmno8kvd/ fiz e testei veja.
>
8 minutos atrás, Marcos_imasters disse:
https://jsfiddle.net/aurasistemas/gmno8kvd/ fiz e testei veja.
Creio que deve estar rolando algum conflito no meu código, como não tenho experiencia em manipular JS, estou apanhando pra cassete. Vou rever meu código e procurar a falha, valeu pela atenção!
Bom graças a sua ajuda, encontrei o problema. Minha classe ".doc", que deveria manter os itens não selecionados, estava sem o ".", no arquivo css, por este motivo os itens não estavam saindo após serem chamados. Muito Obrigado.
>
7 minutos atrás, Guga Alves disse:
Creio que deve estar rolando algum conflito no meu código, como não tenho experiencia em manipular JS, estou apanhando pra cassete. Vou rever meu código e procurar a falha, valeu pela atenção!
voce viu que fiz alteracoes?
>
1 minuto atrás, Marcos_imasters disse:
voce viu que fiz alteracoes?
sim eu vi, porém, eu tinha atualizado minha resposta anterior. Foi justo sua alteração no nome da classe .doc, que fez com que eu resolvesse verificar o css, ao invés de ficar preso ao JS.
Muito obrigado!
Só preciso descobrir como mudar o status para resolvido! Abraços!
onchange="return itemSelect(this)"