首页 文章

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

提问于
浏览 次
513

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

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

我知道按值设置它是非常微不足道的 . 例如

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

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

javascript jquery

19 回答

  • 5

    1.7的最简单方法是：

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

    1.9

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

    经过测试和工作 .

    回复于
  • 1

    看看jquery selectedbox plugin

    selectOptions(value[, clear]):

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

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

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

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

    回复于
  • 740

    鉴于此HTML：

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

    Select by description for jQuery v1.6+:

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

    Select by description for jQuery versions below 1.6 and greater than or equal to 1.4 ：https://stackoverflow.com/a/3644500/31532

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

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

    Select by description for previous versions:

    val() 应该处理这两种情况 . 你没有看到它吗？

    例如：

    $('select').val('1'); // selects "Two"
$('select').val('Two'); // also selects "Two"
    回复于
  • 33

    我没有测试过这个，但这可能对你有用 .

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

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

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

    我是这样做的（jQuery 1.9.1）

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

    注意：不要忘记更改（），我不得不搜索到因为那个:)

    回复于
  • 19
    $("#myselect option:contains('YourTextHere')").val();

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

    回复于
  • 1

    为了避免所有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;
}
    回复于
  • 0

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

    var textToSelect = "Hello World";

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

    希望它可以帮助某人 .

    回复于
  • 0

    这条线有效：

    $("#myDropDown option:contains(myText)").attr('selected', true);
    回复于
  • 136

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

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

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

    回复于
  • 7

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

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

    回复于
  • 4

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

    我有一个rpad函数，可以正确填充字符串，指定的长度，以及指定的字符 . 因此，在填充参数后，它可以工作 .

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


function rpad(pStr, pLen, pPadStr) {
if (pPadStr == '') {pPadStr == ' '};
while (pStr.length < pLen)
    pStr = pStr + pPadStr;
return pStr; 
}
    回复于
  • 3
    $('#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');
});
    回复于
  • 0

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

    $("#free").val("y").change();
    回复于
  • 9

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

    回复于
  • 3

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

    回复于
  • 9

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

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

相关问题