如何在 jQuery 中获取多选的 optgroup？答案

【问题标题】：How to get the optgroup for a multiselect in jQuery?如何在 jQuery 中获取多选的 optgroup？
【发布时间】：2011-05-22 04:39:03
【问题描述】：

我正在使用多选，其中选项组合在一起。

<select title="Fruits" multiple="multiple" id="fruits" name="fruits[]">
    <option selected="selected" label="All" value="">All</option>
    <optgroup label="" class="fruit">
        <option label="apple" value="1">Apple</option>
        <option label="pear" value="2">Pear</option>
        <option label="orange" value="3">Orange</option>
    </optgroup>
    <optgroup label="" class="berries">
        <option label="strawberry" value="4">Strawberry</option>
        <option label="raspberry" value="5">Raspberry</option>
        <option label="blueberry" value="6">Blueberry</option>
    </optgroup>
</select>

我试过$(this).find("option:selected").parent().attr("label")，它只返回第一个选定选项的 optgroup，这意味着如果同时选择了 Strawberry 和 Pear，两个帐户都会返回 optgroup '.fruit'。

使用 jQuery，如何获取每个选定选项的 optgroup？

【问题讨论】：

标签： jquery multi-select optgroup

【解决方案1】：

试试这个

$(this).find("option:selected").each(function(){
    $(this).parent().attr("label");
});

【讨论】：

【解决方案2】：

这可能有点晚了，但我刚刚解决了这个问题，这似乎是我找到的最优雅的解决方案：

$("#fruits option").filter(":selected").parent("optgroup").attr("label");

这是针对这个特定示例修改的小提琴（使用 class 属性而不是 label 属性）：http://jsfiddle.net/pNjsj/

希望对某人有所帮助:)

【讨论】：

如果你正在捕捉一个事件并出于某种原因执行 $(e.target).filter(":selected") 它将不起作用。在这种情况下， $(e.target).find(":selected") 有效。事实上，find() 在这两种情况下都有效，所以我建议你使用它而不是 filter()。

【解决方案3】：

试试.each()

$(this).find("option:selected").each(function(){
    alert($(this).parent().attr("label"));
});

【讨论】：