Definir a opção de selecção 'seleccionado', por valor

Eu tenho um campo select com algumas opções nele. Agora eu preciso selecionar uma dessas opções com jQuery. Mas como posso fazer isso quando eu só sei o "valor" da "opção" que deve ser selecionada?

Eu tenho o seguinte HTML:

<div class="id_100">
  <select>
    <option value="val1">Val 1</option>
    <option value="val2">Val 2</option>
    <option value="val3">Val 3</option>
  </select>
</div>

Eu preciso selecionar a opção com o valor val2. Como isso pode ser feito?

Aqui's uma página de demonstração: http://jsfiddle.net/9Stxb/

Para seleccionar uma opção com o valor 'val2':

$('.id_100 option[value=val2]').attr('selected','selected');
Comentários (11)

Desmarque todas primeiro e filtre as opções selecionáveis:

$('.id_100 option')
     .removeAttr('selected')
     .filter('[value=val1]')
         .attr('selected', true)
Comentários (4)

Você pode selecionar em qualquer atributo e seu valor utilizando o seletor de atributo [atributename=valor opcional], então no seu caso você pode selecionar a opção e definir o atributo selecionado.

$("div.id_100 > select > option[value=" + value + "]").prop("selected",true);

Onde "valor" é o valor pelo qual você deseja selecionar.

Se você precisar remover qualquer valor selecionado anteriormente, como seria o caso se isso fosse usado várias vezes, você precisaria alterá-lo ligeiramente para remover primeiro o atributo selecionado

$("div.id_100 option:selected").prop("selected",false);
$("div.id_100 option[value=" + value + "]")
        .prop("selected",true);
Comentários (0)