带选项组的多选框:每组选择一个

Question

我有一个multiple属性集的选择框.我也使用<optgroup>标签来分隔我选择框中的类别.我正在寻找一种方法,使用javascript或jQuery,让每个组中的各种选项使用"单选按钮逻辑"而不是"复选框逻辑".例如:

<optgroup label="cat1">
    <option>item 1.1</option>
    <option>item 1.2</option>
</optgroup>
<optgroup label="cat2">
    <option>item 2.1</option>
    <option>item 2.2</option>
</optgroup>

1. 用户item 1.1在列表中选择.item 1.1按预期选择.
2. 用户item 2.1在列表中选择.现在,这两个item 1.1和item 2.1选择.
3. 用户item 1.2在列表中选择.现在item 1.1被取消选择,item 2.1而且item 1.2都被选中.

那有意义吗？提前致谢!

Answer 1

$('#select-box-id optgroup option').click(function() {
    // only affects options contained within the same optgroup
    // and doesn't include this
    $(this).siblings().prop('selected', false);
});???????????????????????????????????????

虽然,事实上,如果你想要"单选按钮逻辑",你可能会考虑不使用多选框.无论如何,使用多个选择框的可用性是一种痛苦(人们必须按住Ctrl键单击才能选择多个选项).考虑使用单选按钮,或使用每个组的单选框.两者都更难搞乱.而且他们没有JS工作,这几乎总是一个加号.