jQuery - definindo o valor selecionado de um controle de seleção por meio de sua descrição de texto

Eu tenho um controle select e, em uma variável javascript, tenho uma string de texto.

Usando jQuery, desejo definir o elemento selecionado do controle select como o item com a descrição de texto que tenho (em oposição ao valor, que não tenho).

Eu sei que defini-lo por valor é bastante trivial. por exemplo

$("#my-select").val(myVal);

Mas estou um pouco perplexo ao fazê-lo através da descrição do texto. Acho que deve haver uma maneira de extrair o valor da descrição do texto, mas meu cérebro está muito atrasado na sexta-feira para poder resolver isso.

Selecione por descrição para o jQuery v1.6 +

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).prop('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Versões jQuery abaixo de 1,6 e maiores que ou iguais a 1,4

var text1 = 'Two';
$("select option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text1;
}).attr('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Observe que, embora essa abordagem funcione em versões superiores a 1,6, mas inferiores a 1,9, ela foi preterida desde a versão 1.6. Não funcionará no jQuery 1.9+.

Versões prévias

val() deve lidar com os dois casos.

$('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<select>
  <option value="0">One</option>
  <option value="1">Two</option>
</select>

Não testei isso, mas isso pode funcionar para você.

$("select#my-select option")
   .each(function() { this.selected = (this.text == myVal); });

Tente isto ... para selecionar a opção com o texto myText

$("#my-Select option[text=" + myText +"]").prop("selected", true);

Eu faço dessa maneira (jQuery 1.9.1)

$("#my-select").val("Dutch").change();

Nota: não esqueça a mudança (), tive que pesquisar muito por causa disso :)

$("#myselect option:contains('YourTextHere')").val();

retornará o valor da primeira opção que contém sua descrição de texto. Testei isso e funciona.

Para evitar todas as complicações da versão do jQuery, recomendo sinceramente o uso de uma dessas funções javascript realmente simples ...

function setSelectByValue(eID,val)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].value==val) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

function setSelectByText(eID,text)
{ //Loop through sequentially//
  var ele=document.getElementById(eID);
  for(var ii=0; ii<ele.length; ii++)
    if(ele.options[ii].text==text) { //Found!
      ele.options[ii].selected=true;
      return true;
    }
  return false;
}

Sei que este é um post antigo, mas não consegui selecioná-lo por texto usando o jQuery 1.10.3 e as soluções acima. Acabei usando o seguinte código (variação da solução de spoulson):

      var textToSelect = "Hello World";

      $("#myDropDown option").each(function (a, b) {
            if ($(this).html() == textToSelect ) $(this).attr("selected", "selected");
        });

Espero que ajude alguém.

Esta linha funcionou:

$("#myDropDown option:contains(myText)").attr('selected', true);

 $("#Test").find("option:contains('two')").each(function(){
     if( $(this).text() == 'two' ) {
        $(this).attr("selected","selected");
     }
 });

A instrução if faz uma correspondência exata com "dois" e "dois três" não será correspondida

A maneira mais fácil com 1.7+ é:

$("#myDropDown option:text=" + myText +"").attr("selected", "selected"); 

1.9+

$("#myDropDown option:text=" + myText +"").prop("selected", "selected"); 

Testado e funciona.

Aqui está uma maneira muito simples. plz usá-lo

$("#free").val("y").change();

dê uma olhada no plugin jquery selectedbox

selectOptions(value[, clear]): 

Selecione opções por valor, usando uma sequência como parâmetro $("#myselect2").selectOptions("Value 1");ou uma expressão regular $("#myselect2").selectOptions(/^val/i);.

Você também pode limpar as opções já selecionadas: $("#myselect2").selectOptions("Value 2", true);

Apenas em uma nota lateral. Meu valor selecionado não estava sendo definido. E eu tinha pesquisado por toda a rede. Na verdade, tive que selecionar um valor após uma chamada de retorno de um serviço da web, porque estava obtendo dados dele.

$("#SelectMonth option[value=" + DataFromWebService + "]").attr('selected', 'selected'); 
$("#SelectMonth").selectmenu('refresh', true);

Portanto, a atualização do seletor foi a única coisa que estava faltando.

Eu descobri que usando attr você, você terminaria com várias opções selecionadas quando não quisesse - a solução é usar prop:

$("#myDropDown option:text=" + myText +"").prop("selected", "selected");

Eu tive um problema com os exemplos acima, e o problema foi causado pelo fato de meus valores da caixa de seleção serem pré-preenchidos com cadeias de comprimento fixo de 6 caracteres, mas o parâmetro transmitido não era de comprimento fixo.

Eu tenho uma função rpad que irá preencher uma string com o tamanho especificado e com o caractere especificado. Então, depois de preencher o parâmetro, ele funciona.

$('#wsWorkCenter').val(rpad(wsWorkCenter, 6, ' '));


function rpad(pStr, pLen, pPadStr) {
if (pPadStr == '') {pPadStr == ' '};
while (pStr.length < pLen)
    pStr = pStr + pPadStr;
return pStr; 
} 

 $('#theYear').on('change', function () {
 FY = $(this).find('option:selected').text();
 $('#theFolders').each(function () {
     $('option:not(:contains(' + FY + '))', this).hide();
 });
 $('#theFolders').val(0);
});

$('#theYear').on('mousedown', function () {
 $('#theFolders option').show().find('option:contains("Select")', this).attr('selected', 'selected');
});

Essa resposta aceita não parece correta, enquanto .val ('newValue') está correto para a função, tentar recuperar uma seleção por seu nome não funciona para mim, tive que usar o id e o nome da classe para obter meu elemento

Heres uma opção fácil. Apenas defina sua opção de lista e defina seu texto como valor selecionado:

$("#ddlScheduleFrequency option").selected(text("Select One..."));

Pegue os filhos da caixa de seleção; loop através deles; quando você encontrar o que deseja, defina-o como a opção selecionada; retorne false para parar o loop.