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

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(){

  var Aspired = document.getElementById("Aspired").options;

  var Current = document.getElementById("Current").value;

    

  for (var i=1;  i < +Current; i++) {

      Aspired[i].disabled = true;

  }

}

<label>Current:</label>

<select id="Current" name="Current" onchange="disFun()">

    <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 id="Aspired" 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>