jquery - 如何在 jQuery 的 SELECT 元素中选择特定选项？

Question

如果您知道索引、值或文本。如果您没有直接引用的 ID，也可以。

This , this和 this都是有用的答案。

示例标记

<div class="selDiv">
  <select class="opts">
    <option selected value="DEFAULT">Default</option>
    <option value="SEL1">Selection 1</option>
    <option value="SEL2">Selection 2</option>
  </select>
</div>

Answer 1

按值获取中间选项元素的选择器是

$('.selDiv option[value="SEL1"]')

对于索引:

$('.selDiv option:eq(1)')

对于已知文本:

$('.selDiv option:contains("Selection 1")')

编辑:正如上面评论的那样，OP 可能是在更改下拉列表的所选项目之后。在 1.6 及更高版本中，推荐使用 prop() 方法:

$('.selDiv option:eq(1)').prop('selected', true)

在旧版本中:

$('.selDiv option:eq(1)').attr('selected', 'selected')

EDIT2:在 Ryan 的评论之后。 “Selection 10”上的匹配项可能是不需要的。我没有找到 selector来匹配全文，但是 filter作品:

 $('.selDiv option')
    .filter(function(i, e) { return $(e).text() == "Selection 1"})

EDIT3:谨慎使用 $(e).text()因为它可以包含一个换行符，使比较失败。当隐式关闭选项时会发生这种情况(没有 </option> 标记):

<select ...>
<option value="1">Selection 1
<option value="2">Selection 2
   :
</select>

如果你简单地使用 e.text任何额外的空格(如尾随换行符)都将被删除，从而使比较更加可靠。