javascript - 从选择中隐藏先前选择的选项

Question

我有这个下拉菜单。

<select id="dDown">
     <option value="a">a</option>
     <option value="b">b</option>
     <option value="c">c</option>
</select>

如果我第一次选择b，下次我点击相同的dDown时，唯一会显示的选项应该是a和c。如果我选择a，下一个dDown 选项应该是b 和c。

这怎么可能？

Answer 1

禁用所选选项

$("#dDown").change(function() {
  $("option", this).prop("disabled", false)
  $("option:selected", this).prop("disabled", true)


})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dDown">
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="c">c</option>
</select>

隐藏选择的选项

$("#dDown").change(function() {
  $("option", this).show()
  $("option:selected", this).hide()


})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dDown">
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="c">c</option>
</select>

您可以使用 .prop() 来禁用该选项或使用 .hide() 如果您想隐藏。