Question

我有一个选择控件，在javascript变量中我有一个文本字符串。

使用jQuery我想将select控件的selected元素设置为具有我所拥有的文本描述的项目（而不是我没有的值）。

我知道按值设置它是非常微不足道的。 e.g。

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

但是通过文字描述我有点难过。我想必须有一种从文本描述中获取价值的方法，但是我的大脑在星期五下午也可以解决它。

Answer 1

按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>

jQuery versions below 1.6 and greater than or equal to 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>

请注意，虽然此方法适用于1.6以上但小于1.9的版本，但自1.6以来已弃用。它是jQuery 1.9 +中的 will not work 。

以前的版本

val()应处理这两种情况。

$('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>

Answer 2

我没有测试过这个，但这可能适合你。

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

Answer 3

试试这个...选择带有文本myText的选项

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

Answer 4

我是这样做的（jQuery 1.9.1）

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

注意：不要忘记更改（），我必须长时间搜索：）

Answer 5

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

将返回包含文字说明的第一个选项的值。经过测试并且有效。

Answer 6

为了避免所有jQuery版本的复杂性，我老实说建议使用其中一个非常简单的javascript函数...

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;
}

Answer 7

这条线有效：

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

Answer 8

我知道这是一篇旧帖子，但我无法通过jQuery 1.10.3和上面的解决方案来选择文本。我最终使用了以下代码（spoulson解决方案的变体）：

      var textToSelect = "Hello World";

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

希望它有所帮助。

Answer 9

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

if语句与“two”完全匹配，“two three”将不匹配

Answer 10

1.7+的最简单方法是：

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

1.9 +

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

经过测试和工作。

Answer 11

查看jquery selectedbox plugin

selectOptions(value[, clear]):

按值选择选项，使用字符串作为参数$("#myselect2").selectOptions("Value 1");或正则表达式$("#myselect2").selectOptions(/^val/i);。

您还可以清除已选择的选项：$("#myselect2").selectOptions("Value 2", true);

Answer 12

只是旁注。我的选定值未设置。我在网上搜索过。实际上我必须在从Web服务回调后选择一个值，因为我从中获取数据。

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

所以选择器的刷新是我唯一缺少的东西。

Answer 13

我发现通过使用attr，您最终会在不想要时选择多个选项 - 解决方案是使用prop：

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

Answer 14

这是非常简单的方法。请使用它

cli.save('bpmn');

Answer 15

我上面的例子有问题，问题是由于我的选择框值预填充了6个字符的固定长度字符串，但传入的参数不是固定长度。

我有一个rpad函数，可以将字符串填充到指定的长度，并使用指定的字符。因此，在填充参数后，它可以工作。

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


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

Answer 16

 $('#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');
});

Answer 17

如果您尝试将选择绑定到ID，则以下代码对我有用。

<select name="0product_id[]" class="groupSelect" id="groupsel_0" onchange="productbuilder.update(this.value,0);">
    <option value="0" class="notag" id="id0_0">--Select--</option>
    <option class="notag" value="338" id="id0_338"  >Dual Promoter Puromycin Expression Plasmid - pSF-CMV-PGK-Puro  > £114.00</option>
    <option class="notag" value="282" id="id0_282"  >EMCV IRES Puromycin Expression Plasmid - pSF-CMV-EMCV-Puro  > £114.00</option>
    <option class="notag" value="265" id="id0_265"  >FMDV IRES Puromycin Expression Plasmid - pSF-CMV-FMDV-Puro  > £114.00</option>
    <option class="notag" value="101" id="id0_101"  >Puromycin Selection Plasmid - pSF-CMV-Ub-Puro AscI  > £114.00</option>
    <option class="notag" value="105" id="id0_105"  >Puromycin Selection SV40 Ori Plasmid - pSF-CMV-Ub-Puro-SV40 Ori SbfI  > £114.00</option></select>

这是JS代码

$( document ).ready(function() {
      var text = "EMCV IRES Puromycin Expression Plasmid - pSF-CMV-EMCV-Puro  > £114.00";
      alert(text);
$("#groupsel_0 option").filter(function() {
  //may want to use $.trim in here
  return $(this).text() == text;
}).prop('selected', true);
});

Answer 18

尝试

[...mySelect.options].forEach(o=> o.selected = o.text == 'Text C' )

[...mySelect.options].forEach(o=> o.selected = o.text == 'Text C' );

<select id="mySelect">
  <option value="A">Text A</option>
  <option value="B">Text B</option>
  <option value="C">Text C</option>
</select>

Answer 19

很奇怪，似乎没有其他作用

$（'select [name $ =“ dropdown”]'）。children（）。text（“ Mr”）。prop（“ selected”，true）;

为我工作。

Answer 20

这个接受的答案似乎不正确，而.val（'newValue'）对于该函数是正确的，尝试通过其名称检索选择对我不起作用，我不得不使用id和classname来获取我的元件

Answer 21

这是一个简单的选择。只需设置列表选项，然后将其文本设置为选定值：

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

Answer 22

获取选择框的孩子;循环通过他们;找到想要的那个后，将其设置为所选选项;返回false以停止循环。

jQuery - 通过文本描述设置选择控件的选定值

22 个答案:

按jQuery v1.6 +

jQuery versions below 1.6 and greater than or equal to 1.4

以前的版本