使用 jQuery 禁用和启用下拉选项

Question

我有 2 个下拉菜单，如下所示：

 <div class="col-sm-2 uno_part_wrapper">
  <select class="form-control switcher" id ="1st-dd">
   <option value="23" disable_child= "y" class="disableDropdown">No Pocket</option>
   <option value="24" disable_child= "n" selected="selected"
 class="disableDropdown">1 Pocket</option>
   <option value="25" disable_child= "n" class="disableDropdown">2 Pocket</option>
 </select>
</div>

<div class="col-sm-2 uno_part_wrapper">
  <select class="form-control switcher" id = "flap-drop">
    <option value="26">No Flap</option>
    <option value="27" selected="selected">Flap Pocket</option>
 </select>
</div>

我想要的是当我在下拉列表 1 中选择 No Pocket 时，禁用下拉列表 2 的两个选项。如果在下拉列表 1 中选择了任何其他选项，则启用。

这就是我正在尝试的。

 $(".disableDropdown").click(function(){
 //alert($(this).attr("disable_child"));
  if( $(this).attr("disable_child") == "y")
  {
   $("#flap-drop").attr("disabled",true);
  }
 else{
   $("#flap-drop").attr("disabled",false);
  }
 });

这里出了什么问题？

这是 相同的小提琴。

原文由 Suraj 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

 $("#1st-dd").change(function() {
    $("#flap-drop").attr("disabled", this.value=="23");
    // or $("#flap-drop").toggle(this.value!="23");
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="col-sm-2 uno_part_wrapper">
  <select class="form-control switcher" id="1st-dd">
    <option value="23" disable_child="y" class="disableDropdown">No Pocket</option>
    <option value="24" disable_child="n" selected="selected" class="disableDropdown">1 Pocket</option>
    <option value="25" disable_child="n" class="disableDropdown">2 Pocket</option>
  </select>
</div>

<div class="col-sm-2 uno_part_wrapper">
  <select class="form-control switcher" id="flap-drop">
    <option value="26">No Flap</option>
    <option value="27" selected="selected">Flap Pocket</option>
  </select>
</div>

试试这个方法。而不是点击我使用 change 并比较与你相同的值

原文由 guradio 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您可以使用 prop() ：

 $('option').prop('disabled', 'disabled')

原文由 kapantzak 发布，翻译遵循 CC BY-SA 3.0 许可协议