如何一次获得多个选项答案

【问题标题】：How to get multiple options at one time如何一次获得多个选项
【发布时间】：2011-03-24 22:34:26
【问题描述】：

假设我有一个下拉菜单：

<select id="color">
    <option value="white" selected="selected">White</option>
    <option value="black">Black</option>
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="green">Transparent</option>
</select>

我知道在 jQuery 中我可以得到一个带有选项索引的选项，如下所示：

$('#color option:eq(2)') //get 'red'

但是有没有办法一次获得多个选项？我尝试了以下代码：

$('#color option:eq(2, 3)') //Try to get 'Red' and 'Green'

和

$('#color option:eq([2, 3])') //Try to get 'Red' and 'Green'

但是没有一个工作，如何解决一次获得多个选项？

【问题讨论】：

不使用:eq。您将如何决定需要选择哪些索引？你能不迭代单个:eq选择器吗？

标签： jquery jquery-ui jquery-selectors

【解决方案1】：

如果您想获取集合的子集，可以使用.slice()。

$("#color option").slice(2,3)

如果您想获得不同的元素，您可以执行以下操作：

$("#color option").filter(":eq(2), :eq(4)");

jsfiddle 上的代码示例。

【讨论】：

可能想要修正引号。 ;)
我试过了，发现使用slice()的时候，隐藏了一些选项后，选项列表的索引变了；而使用 filter() 不会改变选项的索引。就我而言， filter() 是首选。谢谢：）

【解决方案2】：

根据您的other question，您可能需要考虑为特定选项添加一个类。这不仅可以让您抓取多个，还可以提供一些上下文：

<select id="color">
    <option value="white" selected="selected" class="past">White</option>
    <option value="black" class="past">Black</option>
    <option value="red" class="future">Red</option>
    <option value="green" class="future">Green</option>
    <option value="green" class="mixed">Transparent</option>
</select>

然后，当您编写逻辑时，您可以执行类似的操作

$('option.future, option.multi').hide();
$('option.past').show();

【讨论】：

【解决方案3】：

选择元素后，您可以像对待任何其他数组一样对待它：

var opts = $('#color option')
var output = ""    
for(var x=0;x<opts.length;x++) {
    output+=" " + opts[x].value    
}
alert(output)

【讨论】：