如何在第二个选择框中禁用选择2个js选定值

Question

我有两个选择框都使用select2 js，第一个可以选择一个值，第二个可以选择多个值，所以我想要的是让这些东西像这样工作 - 如果我在第二个选择框中选择“somecategory”，则必须禁用此选项，如果我在选择框上选择“othercategory”，则同样的选项也应该在第一个框上禁用。

这里是

<select name="category" class="form-control catselect"> 
    /* here is some foreach stuff */ 
<option value="<?php echo $here we get ID;?>" <?php echo $here we get selected="selected";?>><?php echo $sub.lang_key($row->title);?></option> 
</select> 

<select name="multicat[]" class="form-control catmultiselect " multiple="multiple"> 
    /* here is some foreach stuff */ 
<option value="<?php echo $here we get ID;?>" <?php echo $here we get selected="selected";?>><?php echo $sub.lang_key($row->title);?></option> 
</select> 

Answer 1

首先，设置你的multicategory选择框被禁用。接下来，给你的选择框输入一个ID（这是可选的，你可以使用"[name='category']"通过名称而不是ID来引用选择框）。然后，事件处理程序添加到选择框：

$("#categorySelect").on("select2:select", function(e){ 
    var value = $("#categorySelect").val(); 
    var multicat = $("#multiCategorySelect"); 
    if(value == "othercategory") { 
     multicat.prop('disabled', false); // Enable the multi-category select box 
    } else { 
     multicat.val(''); // If you want to clear the selection 
     multicat.prop('disabled', true); // Set it back to disabled 
    } 
});