如何根据在另一个多选中选择的内容从下拉列表中隐藏选项

Question

我有2个下拉菜单是一个选择，一个是多选。两者都有相同的选项可供选择。我想动态隐藏用户在多选中选择的单选中的所有选项。例如，如果用户在多选＆＃34; cat＆＃34;，＆＃34; dog＆＃34;，＆＃34; rat＆＃34;中选择了用户，我希望单选下拉菜单应该隐藏选项＆＃34; cat＆＃34;，＆＃34; dog＆＃34;，＆＃34; rat＆＃34; ...

 $("#Project_AdditionalProjectManagerIds").on('change',
        function() {
            $("#Project_PrimaryProjectManagerId option").show();
            var itemToHide = $(this).val();
            var numberOfOptions = $("#Project_PrimaryProjectManagerId option").length;
            $('#Project_PrimaryProjectManagerId option').filter(function(){
                for (var i = 0; i < numberOfOptions; i++) {
                    for (var a = 0; i < itemToHide.length; i++){
                    if(numberOfOptions[i].val() === itemToHide[a] ) 
                      return true;
                }
                }
                return false;
            }).remove(); 

这是HTML：

 <tr class="control-evenrow">
        <td class="control-label">
            @Html.LabelFor(m => m.Project.PrimaryProjectManagerId, new {@class = ""})
        </td>
        <td class="control-input">
            @Html.DropDownListFor(m => m.Project.PrimaryProjectManagerId, primaryProjectManagerList, "", new {@class = "chosen-select", placeholder = "Select..."})
            @Html.ValidationMessageFor(x => x.Project.PrimaryProjectManagerId)
        </td>
        <td class="control-spacer-column"></td>
        <td class="control-label">
            @Html.LabelFor(m => m.Project.AdditionalProjectManagerIds)
        </td>
        <td class="control-input">
            @Html.ListBoxFor(m => m.Project.AdditionalProjectManagerIds, new MultiSelectList(Model.ProjectManagers, "Id", "FullName", Model.Project.AdditionalProjectManagerIds), new {@class = "chosen-select" })
            @Html.ValidationMessageFor(x => x.Project.AdditionalProjectManagerIds)
        </td>   

我对编程非常陌生，我真的很感激一些帮助。提前谢谢。