Question

我需要一个CSS选择器，如果它包含<select>，其中包含或等于（两者都符合我的要求）指定的文本，则选择<option>元素。示例HTML：

<select name="foo">
  <option value="1">First</option>
  <option value="2">Second</option>
</select>

我想要<select>，如果它包含例如标记为“Second”的选项。像这样：

select[option:contains('Second')]

如果用CSS选择器无法实现这一点，我也会接受JQuery或XPath选择器。

Answer 1

你不能用CSS做到这一点。

你可以使用这个jQuery选择器（:has()而:contains()不是CSS的一部分）：

$("select:has(option:contains('Second'))")

或者这个XPath表达式：

//select[contains(option, 'Second')]

Answer 2

$('select[name="foo"] option:contains("Second")').parent().addClass('selected');

也许这可以帮助

Answer 3

最简单的方法是在选项

上使用contains()选择器

$("select option:contains('Second')")

以下是一个有效的例子：http://jsfiddle.net/8Tn4Z/

以及未包含value属性的版本：http://jsfiddle.net/8Tn4Z/1/

要获取实际的select元素本身，您可以在上面的代码中使用parent()方法，以便：

var selectElement = $("select option:contains('Second')").parent();