获取jQuery中特定索引的选择框值答案

【问题标题】：Get select box value of a particular index in jQuery获取jQuery中特定索引的选择框值
【发布时间】：2020-06-22 18:41:45
【问题描述】：

我有一个选择框，可以选择多个选项。现在我想获取特定索引的值。我怎样才能做到这一点？例如，我有一个具有以下值的选择框：

0 - 苹果 1 - 橙色 2 - 香蕉 3 - 菠萝

现在我想获得索引 2 的值，即香蕉。如何在 jQuery 中做到这一点？

【问题讨论】：

标签： jquery jquery-selectbox

【解决方案1】：

如果选择框的值和文本的值相同，则可以使用eq() 和val() 获取第二次选择的值，如下所示：

console.log($("select option:eq(2)").val());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <option value="Apple">Apple</option>
  <option value="Orange">Orange</option>
  <option value="Banana">Banana</option>
  <option value="Pineapple">Pineapple</option>
</select>

如果选择有数值和文本，则可以使用eq() 和text() 获取文本“香蕉”：

console.log($("select option:eq(2)").text());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <option value="0">Apple</option>
  <option value="1">Orange</option>
  <option value="2">Banana</option>
  <option value="3">Pineapple</option>
</select>

如果您想获得带有文本“香蕉”的选项的值，您可以使用filter()：

console.log($("select option").filter(function () { return $(this).html() == "Banana"; }).val());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
  <option value="0">Apple</option>
  <option value="1">Orange</option>
  <option value="2">Banana</option>
  <option value="3">Pineapple</option>
</select>

【讨论】：