如何根据选定的选项文本选择<select>元素？</select>

Question

假设表单中有许多<select>个元素。我需要一个选择器来选择一个<select>元素，其所选选项具有特定文本。为了解释，假设有5个<select>类“颜色”。每个人都有3个<option>，文本为“白色”，“黑色”，“绿色”。现在我需要选择所选选项为“白色”的元素。

<select class="color" > 
  <option value=""></option>
  <option value="1"> white </option>
  <option value="2"> black </option>
  <option value="2"> green </option>
</select>

在如下图所示的场景中，我需要选择那两个白色<select>。

感谢。

Answer 1

尝试

$('select.color option:contains(white)').prop('selected','selected');

DEMO

选择所选选项为“白色”的所有元素。

Updated DEMO

$('select.color option:contains(white):selected').parent('select');

匹配精确值

DEMO

$('select.color option:contains(white):selected').each(function(){
    if($(this).text() == 'white'){
        $(this).parent('select').css('color','blue');
    }
});

Answer 2

试试这个。

$("select.color option:selected:contains(white)").parent();

这将为您提供所有包含以白色

开头的文字的精选元素

注意：它也会匹配 whitesmoke

编辑：以下代码将为您提供准确的值。

var requiredelements = $("select.color option:selected").filter(
    function()
    {
    return ( $.trim($(this).text())=== 'white')
    }).parent('select');

alert(requiredelements.length);

JSFiddle Demo

Answer 3

$('select.color').each(function(index, element) {
 if($(this).find('option:selected').text()=='white') {
  // do something with select box which contains white text or use array to get all contents
 }
});