jquery - 多选下拉菜单 : Disable selected option only (jQuery)

Question

我需要在用户选择下拉列表中禁用每个选择选项。

现在，下面的代码仅禁用下拉列表中值为“red”的值，因为我有值=“red”的硬编码。我如何让它抓取用户的选择并仅禁用该选择？

(更新代码片段)

 $(".mutliSelect select").on("change", function() {
    
        var displayTitle = $(this).val() + "";
        
        if ($(this).is(":selected")) {
          $(".hida").show();
        } else {

        $("option[value*='red']").prop('disabled',true);
         
        var p_elem = $("<span />")
            .attr("class", "categoryBubble")
            .attr("title", displayTitle)
            .text(displayTitle);
    
        var other_span = $("<span />")
            .on("click", foo)
            .addClass("Xout")
            .text("x");

          $(p_elem).append(other_span);
          $(".multiSel").append(p_elem);

          $(".hida").hide();
        }
      });

Answer 1

这在普通 Javascript 中非常简单:

select.addEventListener('change', function() {
  for (let option of this.querySelectorAll('option')) {
    option.disabled = [...this.selectedOptions].includes(option)
  }  
})

<select id="select">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
</select>

这假设您只想禁用当前选择的选项，并启用所有其他选项。如果这不正确，请留下评论，说明您到底需要什么。