如何在更改前一个值下拉列表后启用下拉列表

时间:2018-03-02 04:07:53

标签: jquery

                                                                      泉                         过冬                                      
            <div class="form-group col-md-3">
                <select class="selectpicker tech_drop" style="width: 175px; height: 25px" name="Technology" id="tech2" disabled="disabled">
                    <option></option>
                    <option>Springs</option>
                    <option>Hibernate</option>
                </select>
            </div>
            <div class="form-group col-md-3">
                <select class="selectpicker tech_drop" style="width: 175px; height: 25px" name="Technology" id="tech3" disabled="disabled">
                    <option></option>
                    <option>Springs</option>
                    <option>Hibernate</option>
                </select>
            </div>
            <div class="form-group col-md-3">
                <select class="selectpicker tech_drop" style="width: 175px; height: 25px" name="Technology" id="tech4" disabled="disabled">
                    <option></option>
                    <option>Springs</option>
                    <option>Hibernate</option>
                </select>
            </div>

我有12个这样的下拉菜单,我需要做的是只在第一次选择后启用第二次下拉菜单,只有在选择第二次时启用第三次下载等等我尝试使用.next()但是它不能正常工作

2 个答案:

答案 0 :(得分:1)

也许以下代码会有所帮助。

$(".tech_drop").change(function(obj){
  var next_select = $(this).closest('div').next().find('select');
  $(next_select).prop('disabled', false);
})

答案 1 :(得分:1)

您可以添加此JQuery代码以禁用或启用Dropdown。

$(function(){
     $("#tech2").prop('disabled', false);
        $("#tech2").click(function(){
            $("#tech3").prop('disabled', false);
        });
        $("#tech3").click(function(){
            $("#tech4").prop('disabled', false);
        });
    });

我已将我的JSfiddle链接附加到此答案。你也可以试试这个。 JSFiddle