Jquery optgroup标签及其子类

Question

如何根据所选的box_B选项获得box_A optgroup的标签名？

我使用以下函数试图提醒box_A父标签，但无法得到它，如果我更改为var label = $(e).attr('value');，则选项值将显示。

function showLabel(e){ 
    if($(e).attr('checked')=='checked'){
         var label = $(e).parent().attr('label');
         alert(label);
    }
}

复选框：

<select id="box_A" multiple="multiple">
    <optgroup label="Asia: Japan">
        <option value="1 - Toyota">1 - Toyota</option>
        <option value="2 - Honda">2 - Honda</option>
    </optgroup>
    <optgroup label="Europe: German">
        <option value="3 - Mercedes">3 - Mercedes</option>
    </optgroup>
</select>

<select id="box_B" multiple="multiple">
    <optgroup label="1 - Toyota">
        <option value="1A - Camry">1A - Camry</option>
        <option value="1B - Yaris">1B - Yaris</option>
    </optgroup>
    <optgroup label="2 - Honda">
        <option value="2A - Civic">2A - Civic</option>
    </optgroup>
    <optgroup label="3 - Mercedes">
        <option value="3A - SL320">3A - SL320</option>
    </optgroup>

</select>

调用该函数：

$(document).ready(function() {

    $("#box_A").multiSelect({}, showLabel);

}

谢谢。

Answer 1

假设在单击选项时调用showLabel并传递jQuery事件对象，则可以使用以下方法：

function showLabel(e){ 
    var $target = $(e.target);
    if($target.is(':selected')){
         var label = $target.closest('optgroup').attr('label');
         alert(label);
    }
}

编辑：

在查看了你发布的插件后，我的上述假设似乎是错误的。showLabel不是传递一个jQuery事件，而是为单击的项传递jQuery对象，这也是一个复选框，而不是选项。试着用这个代替：

function showLabel($target){ 
    if($target.is(':checked')){
         var label = $target.closest('optgroup').attr('label');
         alert(label);
    }
}