Javascript选择元素显示选项

Question

我有两个选择框。如何根据另一个框的文本在一个框中显示/隐藏某些选项？

例如，我有两个盒子Job和Year。如果我在作业框中选择选项学生，则年框仅显示选项1年和2年，如果我在作业框中选择选项讲师，则年框将显示2年和5年选项？

Answer 1

＆＃13;

＆＃13;

    var sel1 = document.querySelector('#sel1');
    var sel2 = document.querySelector('#sel2');
    var options2 = sel2.querySelectorAll('option');

    function giveSelection(selValue) {
      sel2.innerHTML = '';
      for(var i = 0; i < options2.length; i++) {
        if(options2[i].dataset.option === selValue) {
          sel2.appendChild(options2[i]);
        }
      }
    }

    giveSelection(sel1.value);

＆＃13;

    <select id="sel1" onchange="giveSelection(this.value)">
      <option value="s">student</option>
      <option value="l">lecturer</option>
    </select>
    <select id="sel2">
      <option data-option="s">1 year</option>
      <option data-option="s">2 years</option>
      <option data-option="l">2 years</option>
      <option data-option="l">5 years</option>
    </select>

＆＃13;

＆＃13;

＆＃13;