Clicky

Jump to content
  • Sign Up
Sign in to follow this  
Igor Bueno

Dúvida com menu drop down

Recommended Posts

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.

Share this post


Link to post
Share on other 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.

  • Like 1

Recomendo: MobaXterm

Share this post


Link to post
Share on other 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.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.




×
×
  • Create New...