禁用其他列表框,除非用户已在第一个列表框中选择

时间:2015-06-05 05:45:43

标签: jquery asp.net listbox

除非用户从我的第一个列表框中选择,否则我将如何禁用其他列表框?

 <asp:DropDownList ID="ddlLead1" runat="server">
                                <asp:ListItem Text="-Please Select-" Selected="True" Value="-Please Select-"/>
                                <asp:ListItem Text="Type 1" Value="Category 1" />
                                <asp:ListItem Text="Type 2" Value="Category 2" />
                                <asp:ListItem Text="Type 3" Value="Category 3" />
                             </asp:DropDownList>

 <asp:DropDownList ID="ddlLead2" runat="server">
                                <asp:ListItem Text="-Please Select-" Selected="True" Value="-Please Select-"/>
                                <asp:ListItem Text="Type 1" Value="Category 1" />
                                <asp:ListItem Text="Type 2" Value="Category 2" />
                                <asp:ListItem Text="Type 3" Value="Category 3" />
                             </asp:DropDownList>

<asp:DropDownList ID="ddlLead3" runat="server">
                                <asp:ListItem Text="-Please Select-" Selected="True" Value="-Please Select-"/>
                                <asp:ListItem Text="Type 1" Value="Category 1" />
                                <asp:ListItem Text="Type 2" Value="Category 2" />
                                <asp:ListItem Text="Type 3" Value="Category 3" />
                             </asp:DropDownList>

我用jquery尝试了它,但它不起作用。有人可以帮忙吗?

1 个答案:

答案 0 :(得分:0)

&#13;
&#13;
$('#ddl1').change(function(){
    var ddl1=$(this);
    var ddl2=$('#ddl2');
  var ddl3=$('#ddl3');
    if (ddl1.val()!=-1){ddl2.removeAttr('disabled');ddl3.removeAttr('disabled');}
    else{ddl2.attr('disabled','disabled').val(0);ddl3.attr('disabled','disabled').val(0);}
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<select id="ddl1" class="ddl">
    <option value="-1">choose</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<select id="ddl2" class="ddl" disabled="disabled">
    <option value="0">choose</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<select id="ddl3" class="ddl" disabled="disabled">
    <option value="0">choose</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
&#13;
&#13;
&#13;