3

Tenho um código em HTML do qual traz as seguintes informações:

<select name="QtdAcomodacaoD" id="QtdAdomodacaoDuplo" class="form-control" style="width:130px" onchange="soma()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

E estou tentando pegar os valores com JQuery dessa forma:

var QtdAcomodacaoD = $("#QtdAcomodacaoDuplo").val();

Porém quando dou um alert, aparece Undefined.

4 Respostas 4

16

Experimente fazer assim:

$("#QtdAdomodacaoDuplo option:selected").each(function() {
   var QtdAcomodacaoD = $(this).val();
}); 

ou:

var QtdAcomodacaoD = $("#QtdAdomodacaoDuplo option:selected").val();
4

Nesse caso podes pegar com val() ou text() basta adicionar option:selected no seu seletor:

 var itemSelecionado = $("#QtdAdomodacaoDuplo option:selected");

 document.write(itemSelecionado.text() + ' text()<br>');

 document.write(itemSelecionado.val() + ' val()');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<select name="QtdAcomodacaoD" id="QtdAdomodacaoDuplo" class="form-control" style="width:130px" onchange="soma()">
  <option value="1" selected>1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<br>

2

Essas ai são boas, porém pra funcionar em tempo real, tens que fazer desta maneira:

$('.select-estados').change(function (){
     console.log($(this).val());
 });

quando ocorre a mudança nos valores, exibe o selecionado, ai voce pode armazenar em uma variável desse modo:

$('.select-estados').change(function (){
    var cidade = ($(this).val());
    console.log(cidade);
 });

então você poderá fazer chamadas com AJAX, e povoar suas tags.

Pra pegar o value do option você faz:

 $('.select-estados').change(function (){
     console.log($('.select-estados option:selected').val());
 });
0

Cuidado com eventos que usam classes, podem conter outros elementos. No exemplo anteriores, se a classe .select-estados tivesse outros elementos poderia resultar em erro. O correto é fazer assim:

    $('.select-estados').change(function(event){
   var cidade = event.currentTarget.value;
   alert(cidade);
 });
<!DOCTYPE html>
<html>
<body>
<script 
src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>

<select id="id_do_select" class="select-estados" data-placeholder='Nenhum valor selecionado...'>
    <option value="valor 1">Texto 1</option>
    <option value="valor 2">Texto 2</option>
    <option value="valor 3">Texto 3</option>
</select>

</body>
</html>

O mais seguro é usar o currentTarget.

Veja o funcionamento neste link.

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