Question

HTML

column C

的Javascript

<select id="myDDL">
    <option selected="selected" value="0">default</option>
    <option value="1">apples</option>
    <option value="2">oranges</option>
</select>

的jsfiddle

https://jsfiddle.net/nnvh7e43/

我想根据文本在选择字段中选择一个选项，即：

setFieldValue("myDDL", "apples");

function setFieldValue(field, value)
{
    var val = $("#" + field + " option[text]");
    console.log(val);
    $("#" + field).val(val);
}

然而，只要我在选项后添加[text]，选择器似乎选择整个文档，而$（“＃”+ field +“option”）;如我所料，只需在选择字段中选择所有选项标签。

请您解释一下为什么它不能识别“[text]”以及我如何纠正这个问题？

由于

Answer 1

apples是选项的文本，而不是其值。您需要在此处使用.filter()函数：

 $("#" + field + " option").filter(function(){
       return $(this).text() === value ;
 });

此外，您正在尝试按文本获取选项值，然后设置它选择的价值。您可以将选项的selected属性设置为true以将其设置为选中：

 $("#" + field + " option").filter(function(){
       return $(this).text() === value ;
 }).prop('selected', true);

<强> Working Demo

Answer 2

[] css选择器只能用于属性（href，selected，value，class，id，... ）。你不能在html元素的内容上使用它。

Milind Anantwar解决方案是可行的方法。使用filter：

 $("#" + field + " option").filter(function(){
     return $(this).text() === value ;
 });

Answer 3

你可以这样做：

function setFieldValue(field, value) {

    // First filter all option by text, then get that option value
    var val = $("#" + field + " option").filter(function () {
        return $.trim($(this).text()) == value;
    }).val();
    console.log(val);

    // Set the option w/ text value here
    $("#" + field).val(val);
}

FIDDLE DEMO

Answer 4

tagname[attributename]等选择器会在tagname元素上查找实际属性。您的option元素没有text属性。因此，您需要为它们提供text属性，或者可能更喜欢修改您的选择器以检查元素的实际内部文本，而不是查找属性，例如与contains：

var val = $("#" + field + " option:contains(" + value + ")");

Jquery选择器 - 文本等于 - 不工作

4 个答案: