如何根据第一个下拉菜单的选中值控制另一个下拉菜单的禁用状态

• 你使用的Chosen多选插件会隐藏原生<select>标签，自行渲染可视化的交互组件，直接修改原生select的disabled属性不会同步更新Chosen的渲染结果，因此看不到预期效果。

• 给第二个select默认添加disabled属性，保证初始状态为禁用
• 原生select的disabled属性变更后，调用trigger("chosen:updated")通知Chosen插件同步刷新UI
• 统一使用jQuery语法绑定事件，和已引入的jQuery、Chosen生态兼容

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js"></script>
<link href="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css" rel="stylesheet" />
<div class="control-group ">
  <label for="company" class="sr-only">machine</label>
  <div class="controls">
    <select name="company" class="form-control" id="company" required>
      <option></option>
      <option value="Hire">Plant Hire</option>
      <option value="Machine">Plant Machine</option>
      <option value="Store">Plant Store</option>
      <option></option>
    </select>
  </div>
</div>
<div class="control-group">
  <div class="controls">
    <label for="machine" class="sr-only">Machinery</label>
    <!-- 这里默认加disabled属性 -->
    <select name="machine" id="machine" disabled data-placeholder="Select 1 or Multiple Machinery" multiple class="chosen-select">
      <option></option>
      <option>TLB 4x4 with a bucket</option>
      <option>Tipper truck 10m^3</option>
      <option>Grader</option>
      <option>Roller (10ton)</option>
      <option>Excavator 30ton with a bucket </option>
      <option>Excavator 30ton with a pecker</option>
      <option>3.5ton pecker for excavator</option>
      <option>TLB 4x4 with a pecker</option>
      <option></option>
    </select>
  </div>
</div>
<script>
$("#company").on("change", function() {
  const $machineEl = $("#machine");
  if ($(this).val() === "Machine") {
    $machineEl.removeAttr("disabled");
  } else {
    $machineEl.attr("disabled", true);
    // 禁用时可以清空已选内容，不需要可删除该行
    $machineEl.val("");
  }
  // 通知Chosen更新状态
  $machineEl.trigger("chosen:updated");
})
$(".chosen-select").chosen({no_results_text: "Nothing Selected"})
</script>

内容的提问来源于stack exchange，提问作者Theophilus