javascript - 如何在引导多选下拉菜单中启用/禁用下拉菜单

Question

let list1 = new Set();
   let list2 = new Set();

   document.querySelector('#list1_items').addEventListener('change', e => {
    e.target.select ? list1.add(e.target.value) : list1.delete(e.target.value);
     if(list1.size) document.querySelectorAll('#list2_items > option ').forEach(el => el.disabled = true);
     else document.querySelectorAll('#list2_items > option ').forEach(el => el.disabled = false);
   });

   document.querySelector('#list2_items').addEventListener('change', e => {
    e.target.select ? list2.add(e.target.value) : list2.delete(e.target.value);
     if(list2.size) document.querySelectorAll('#list1_items > option ').forEach(el => el.disabled = true);
     else
       document.querySelectorAll('#list1_items > option ').forEach(el => el.disabled = false);
   });

<script src="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/js/bootstrap-select.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap-select@1.13.9/dist/css/bootstrap-select.min.css" rel="stylesheet"/>
<span id="span_month">
              <div id="list1" class="dropdown-check-list" tabindex="100">
                <div class="custom-dropdown">
                <div class="options">
                  <select
                id="list1_items"  name="month"
              multiple
              data-style="bg-white px-4 py-3 shadow-none mb-5 rounded-0 border kpi_month"
              class="selectpicker items  "
              title="Select Month">
                      <option></option>

                  </select>
              </div>
            </div>
          </div>
        </span>
            <span id="span_quarter">
              <div id="list2" class="dropdown-check-list" tabindex="100">
                <div class="custom-dropdown">
                <div class="options">
                  <select
                id="list2_items"  name="quarter"
              multiple
              data-style="bg-white px-4 py-3 shadow-none mb-5 rounded-0 border kpi_quarter"
              class="selectpicker items"
              title="Select Quarter">
                      <option></option>

                  </select>
              </div>
            </div>
          </div>
        </span>

但是这个 jQuery 不起作用。如果从 1 个下拉列表中选择值，我想禁用第二个下拉列表，反之亦然，因为一次只能使用一个下拉列表。如果有人可以请帮助我。谢谢

标签： javascripthtmljquery