Javascript 如何根据不同选择中的更改隐藏选择范围内的选项？

相关的

我已经玩了一个小时了，我很沮丧。叹气我试图做到的是：如果在第1天选择了PersonA，那么他在第1天的任何地方都不能再次选择。然而，在第2天，角色应该仍然可用

当前，如果选择了角色，则将从所有其他选择中删除角色。我试图通过使用最近的“.selector_table”来磨练相关的选择

我做错了什么

提前，非常感谢您

奖金基本问题：撤销变更是否需要大量的工作。例如，如果有人选择了PersonA，它会如前所述隐藏PersonA，但如果随后在同一个select上选择了PersonB，它会撤消该更改，PersonA将再次可用？

将更改事件应用于select元素，获取同级select并禁用其匹配选项元素

$select.changefunction{ const selectedOptionVal=$this.find:selected[0]。值； const sibSelectEle=$this.sibers'select'； sibSelectEle.children'option'。每个函数，选项{ 如果选择OptionVal==option.value{ $option.attr已禁用，为true； }否则{ $option.attrdisabled，false； } }; }; 第一天 人格面具 人 人格面具 人 第2天 人格面具 人 人格面具 人

<form id="calendar_form">
    <div class="day1">
        Day 1
        <table class="selector_table">
            <select name="select1">
                <option></option>
                <option value="optionA">PersonA</option>
                <option value="optionB">PersonB</option>
            </select>
            <select name="select2">
                <option></option>
                <option value="optionA">PersonA</option>
                <option value="optionB">PersonB</option>
            </select>
        </table>
    </div>
    <br>
    <div class="day2">
        Day 2
        <table class="selector_table">
            <select name="select3">
                <option></option>
                <option value="optionA">PersonA</option>
                <option value="optionB">PersonB</option>
            </select>
            <select name="select4">
                <option></option>
                <option value="optionA">PersonA</option>
                <option value="optionB">PersonB</option>
            </select>
        </table>
    </div>
</form>
<script>
    $("select").change(function(){
        var selectThatWasChanged = $(this).attr('id');
        var valueToRemove = $(this).val();
        var dayWorkingWith = $(this).closest('.selector_table');
        $('option', dayWorkingWith).not('#' + selectThatWasChanged + ' option');
        $('option[value="' + valueToRemove + '"]').not('#' + selectThatWasChanged + ' option').hide();
    });
</script>