Clicky

Ir para conteúdo

Igor Bueno

Dúvida com menu drop down

Posts Recomendados

Bom dia galera,

Eu estou com uma dúvida referente a um menu drop down, se eu não estiver enganado, sei que é necessário javascript para fazer o que eu quero, que é basicamente o seguinte:

Quando a pessoa selecionar uma opção no menu drop down, a área determinada mude o seu valor de acordo com o que for selecionado.

Eu vou deixar uma imagem detalhando o que eu quero.

Agradeço quem puder compartilhar conosco essas informações. 

dropdown.png

 


Não tenha medo de tentar nem se culpe quando fizer algo que não dê certo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom dia Igor,

fiz isso a algum tempo com javascript, é bem simples. Veja:

Código do Select:

<select onchange="javascript:open_tab(this.value)">
<option value="0">Opção 0</option>
<option value="1">Opção 1</option>
</select>

Código do javascript (função open_tab - nome que eu dei a função):

<script type="text/javascript">
function open_tab(id) {
	var local1 = document.getElementById("IDdoSPAN");
	if(id == 0) {
	    local1.innerHTML = 'COLOQUE O NOVO TEXTO AQUI OU COD HTML';
	}
	if(id == 1) {
	    local1.innerHTML = 'COLOQUE O NOVO TEXTO AQUI OU COD HTML';
	}
}
</script>

É possível alterar atributos CSS também utilizando assim:

document['getElementById']('IDdoSPAN')['style']['border'] = '';

E por fim, no seu HTML, defina o lugar onde quer alterar o conteúdo, assim:

<span id="IDdoSPAN">Opção 0</span>

Pode usar com div também, se preferir.

  • Gostei! 1

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bom dia Igor,

fiz isso a algum tempo com javascript, é bem simples. Veja:

Código do Select:

<select onchange="javascript:open_tab(this.value)">
<option value="0">Opção 0</option>
<option value="1">Opção 1</option>
</select>

Código do javascript (função open_tab - nome que eu dei a função):

<script type="text/javascript">
function open_tab(id) {
	var local1 = document.getElementById("IDdoSPAN");
	if(id == 0) {
	    local1.innerHTML = 'COLOQUE O NOVO TEXTO AQUI OU COD HTML';
	}
	if(id == 1) {
	    local1.innerHTML = 'COLOQUE O NOVO TEXTO AQUI OU COD HTML';
	}
}
</script>

É possível alterar atributos CSS também utilizando assim:

document['getElementById']('IDdoSPAN')['style']['border'] = '';

E por fim, no seu HTML, defina o lugar onde quer alterar o conteúdo, assim:

<span id="IDdoSPAN">Opção 0</span>

Pode usar com div também, se preferir.

Pedro, funcionou certinho! 

Me ajudou e tenho certeza que vai ajudar muita gente, valeu!

 


Não tenha medo de tentar nem se culpe quando fizer algo que não dê certo.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Participe da conversa

Você pode postar agora e se cadastrar mais tarde. Se você tem uma conta, faça o login para postar com sua conta.

Visitante
Responder

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emojis são permitidos.

×   Seu link foi automaticamente incorporado.   Mostrar como link

×   Seu conteúdo anterior foi restaurado.   Limpar o editor

×   Não é possível colar imagens diretamente. Carregar ou inserir imagens do URL.


  • Quem Está Navegando   0 membros estão online

    Nenhum usuário registrado visualizando esta página.



×
×
  • Criar Novo...