Javascript 相互排斥<;选项>;a<;选择>;?

Javascript 相互排斥<;选项>;a<;选择>;?,javascript,jquery,Javascript,Jquery,我需要将单选和多选的功能组合到一个控件中。具体来说,我有很多选择。第一种是相互排斥的。因此,如果我选择第一个,它需要取消选中所有其他。如果选择了其中一个,则必须取消选中第一个(如果选择)。其他选项应互不影响 <select id="myGroup" data-native-menu="false" multiple="multiple" > <option value="" >Select Group(s)</option> <opti

我需要将单选和多选的功能组合到一个控件中。具体来说,我有很多选择。第一种是相互排斥的。因此,如果我选择第一个,它需要取消选中所有其他。如果选择了其中一个,则必须取消选中第一个(如果选择)。其他选项应互不影响

<select id="myGroup" data-native-menu="false" multiple="multiple" >
    <option value=""  >Select Group(s)</option>
    <option value="-1" selected="selected" >I am alone</option>
    <option value="1"  >I am not alone 1</option>
    <option value="2"  >I am not alone 2</option>
    <option value="3"  >I am not alone 3</option>
</select>

有更好的方法吗?

您只需要保留第一个选项的状态,而不是所有选项:

var firstOption = $("#myGroup > option[value=-1]");
var firstSelectedBefore = firstOption.prop("selected");

$("#myGroup").on("change", function(event) {
    if (firstOption.prop("selected") && this.selectedOptions.length > 1) {
        if (firstSelectedBefore) { // non-first option just selected
            firstOption.prop("selected", false);
        } else { // first option just selected
            $(this).find("option:not([value=-1])").prop("selected", false);
        }
    }
    firstSelectedBefore = firstOption.prop("selected");
});

请显示您的代码。为什么要设置多重属性?为什么每行的末尾都有分号?j08691:对不起,分号来自一个糟糕的剪切粘贴作业。。。我把它们拿走了。我希望用户能够选择-1或1,2,3的任意组合。第一种选择是排除其他选择。这有用吗?
var firstOption = $("#myGroup > option[value=-1]");
var firstSelectedBefore = firstOption.prop("selected");

$("#myGroup").on("change", function(event) {
    if (firstOption.prop("selected") && this.selectedOptions.length > 1) {
        if (firstSelectedBefore) { // non-first option just selected
            firstOption.prop("selected", false);
        } else { // first option just selected
            $(this).find("option:not([value=-1])").prop("selected", false);
        }
    }
    firstSelectedBefore = firstOption.prop("selected");
});