根据第一个下拉菜单选项禁用第二个下拉菜单选项

Question

我需要禁用 Aspired 下拉菜单中的选项。例如，用户为“当前”选择了 3，对于 Aspired，选项 1 和 2 将被禁用。如果用户在“当前”中选择了 4，则选项 1、2 和 3 将被禁用，依此类推。我需要帮助使用 JavaScript 创建逻辑。

<label>Current:</label>

<select name="Current">

  <option value="select">Select</option>

  <option value="1">1</option>

  <option value="2">2</option>

  <option value="3">3</option>

  <option value="4">4</option>

  <option value="5">5</option>

  </select>

<label>Aspired:</label>

<select name="Aspired">

  <option value="select">Select</option>

  <option value="1">1</option>

  <option value="2">2</option>

  <option value="3">3</option>

  <option value="4">4</option>

  <option value="5">5</option>

</select>

Answer 1

function disFun(){&nbsp; var Aspired = document.getElementById("Aspired").options;&nbsp; var Current = document.getElementById("Current").value;&nbsp; &nbsp;&nbsp;&nbsp; for (var i=1;&nbsp; i < +Current; i++) {&nbsp; &nbsp; &nbsp; Aspired[i].disabled = true;&nbsp; }}<label>Current:</label><select id="Current" name="Current" onchange="disFun()">&nbsp; &nbsp; <option value="select">Select</option>&nbsp; &nbsp; <option value="1">1</option>&nbsp; &nbsp; <option value="2">2</option>&nbsp; &nbsp; <option value="3">3</option>&nbsp; &nbsp; <option value="4">4</option>&nbsp; &nbsp; <option value="5">5</option>&nbsp; &nbsp; </select><label>Aspired:</label><select id="Aspired" name="Aspired">&nbsp; &nbsp; <option value="select">Select</option>&nbsp; &nbsp; <option value="1">1</option>&nbsp; &nbsp; <option value="2">2</option>&nbsp; &nbsp; <option value="3">3</option>&nbsp; &nbsp; <option value="4">4</option>&nbsp; &nbsp; <option value="5">5</option></select>