3

Tenho o seguinte código:

<select>
    <optgroup label="fruta">      
        <option value="banana">banana</option>
        <option value="uva">uva</option>
    </optgroup>

    <optgroup label="legume">
        <option value="batata">batata</option>
        <option value="cenoura">cenoura</option>
    </optgroup>
</select>
<div id="label_value"></div>

Gostaria em JQuery pegar o valor do label e value e jogar numa div.

2 Respostas 2

1

Podes fazer isso assim:

$('select').change(function () {
    var label = $(this).find(':selected').closest('optgroup').attr('label');
    $('#label_value').html(label);
});

jsFiddle: http://jsfiddle.net/cujweb2h/

O código vai buscar a option selecionada e depois sobe no DOM para ir buscar o optgroup dessa option. Aí lê o atributo label.

3
  • Olá Sergio, tem como já deixar escrito na div as primeiras opções? Tipo: No html a primeira opção é fruta banana. Tem como já aparecer antes do usuário escolher outra coisa? Commented 8/07/2015 às 13:09
  • @ProfºRafaelFerreira sim, é so fazer $('select').change(); -> jsfiddle.net/cujweb2h/1
    – Sergio
    Commented 8/07/2015 às 13:19
  • 1
    Mais uma vez, obrigado. Commented 8/07/2015 às 13:33
0

Sergio, muito obrigado. Estou aprendendo agora a fazer JS e tô inventando certas situações e práticar. Eu até queria que aparecesse não só o atributo "label", mas junto dele aparecesse o atributo "value" do option. Aí fiz as seguintes alterações

$(window).load(function(){
  $('select').change(function () {
    var label = $(this).find(':selected').closest('optgroup').attr('label');
    var value = $(this).find(':selected').closest('option').attr('value');
    $('#label_value').html(label+value);
});
});
2
  • Vi agora que deste esta resposta também. Penso que isto é uma continuação da pergunta, e não uma resposta certo? Se fôr o caso deves apagar. Mas em relação ao que referes podes usar o this.value dentro dessa função para teres o option escolhido. Assim: jsfiddle.net/cujweb2h/2
    – Sergio
    Commented 8/07/2015 às 15:17
  • 1
    Nada. Foi só pra agradecer e mostrar uma pequena alteração que fiz e não pode colocar codigos nos comentários. Mas obrigado pela dica. Sou novo no forum, ainda tenho muito que aprender. Commented 8/07/2015 às 15:32

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .