我有 2 个 DropDownList。第一个 DropDownList 有 4 个选项。第二个 DropDownList 有 20 个选项。我想要一个选项value = 1
在第一个 DropDownList 中选择我在第二个 DropDownList 中显示所有元素。如果选项带有value = 2
在第一个 DropDownList 中选择我显示一些第二个 DropDownList 选项等等。我如何使用来做到这一点jQuery
Edit 1)
代码是:
<div>
<asp:DropDownList ID="DropDownList1" runat="server" Height="72px" Width="184px">
<asp:ListItem Value="1">All</asp:ListItem>
<asp:ListItem Value="2">Apples</asp:ListItem>
<asp:ListItem Value="2">Orange</asp:ListItem>
<asp:ListItem Value="3">Onion</asp:ListItem>
</asp:DropDownList>
<br />
<asp:DropDownList ID="DropDownList2" runat="server" Height="18px" Width="187px">
<asp:ListItem Value="Apple_Style_1">Apple Style 1</asp:ListItem>
<asp:ListItem Value="Apple_Style_2">Apple Style 2</asp:ListItem>
<asp:ListItem Value="Apple_Style_3">Apple Style 3</asp:ListItem>
<asp:ListItem Value="Orange_Style_1">Orange Style 1</asp:ListItem>
<asp:ListItem Value="Orange_Style_2">Orange Style 2</asp:ListItem>
<asp:ListItem Value="Orange_Style_3">Orange Style 3</asp:ListItem>
<asp:ListItem Value="Orange_Style_4">Orange Style 4</asp:ListItem>
<asp:ListItem Value="Onion_Style_1">Onion Style 1</asp:ListItem>
<asp:ListItem Value="Onion_Style_2">Onion Style 2</asp:ListItem>
</asp:DropDownList>
</div>
你可以试试这个jsFiddle:http://jsfiddle.net/Chran/1/ http://jsfiddle.net/Chran/1/
HTML
<div>
<select ID="DropDownList1" Height="72px" Width="184px">
<option Value="1">All</option>
<option Value="2">Apples</option>
<option Value="2">Orange</option>
<option Value="3">Onion</option>
</select>
<br />
<select ID="DropDownList2" Height="18px" Width="187px">
<option Value="Apple_Style_1">Apple Style 1</option>
<option Value="Apple_Style_2">Apple Style 2</option>
<option Value="Apple_Style_3">Apple Style 3</option>
<option Value="Orange_Style_1">Orange Style 1</option>
<option Value="Orange_Style_2">Orange Style 2</option>
<option Value="Orange_Style_3">Orange Style 3</option>
<option Value="Orange_Style_4">Orange Style 4</option>
<option Value="Onion_Style_1">Onion Style 1</option>
<option Value="Onion_Style_2">Onion Style 2</option>
</select>
</div>
JavaScript
var options = $("#DropDownList2").html();
$("#DropDownList1").change(function(e) {
var text = $("#DropDownList1 :selected").text();
$("#DropDownList2").html(options);
if(text == "All") return;
$('#DropDownList2 :not([value^="' + text.substr(0, 3) + '"])').remove();
});
您必须根据 ASP.Net 控件 Id 更改 Id。
希望这对您有帮助。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)