1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head runat="server"> 3 <title></title> 4 <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 5 <script type="text/javascript"> 6 $(document).ready(function () { 7 //写法1 8 //var ddl = document.getElementById("<%=ddlDept.ClientID %>"); 9 //写法2 10 //var ddl=$("#<%=ddlDept.ClientID%>"); 11 alert(ddl.selectedIndex); 12 }); 13 14 15 function show(obj) { 16 var v = $(obj).val(); 17 alert(v); 18 } 19 </script> 20 </head> 21 <body> 22 <form id="form1" runat="server"> 23 <div> 24 <asp:DropDownList runat="server" ID="ddlDept" onchange="show(this)" /> 25 </div> 26 </form> 27 </body> 28 </html>
上面是前台代码,下面是后台代码.
1 public partial class WebForm1 : System.Web.UI.Page 2 { 3 protected void Page_Load(object sender, EventArgs e) 4 { 5 List<string> list=new List<string>(){"aaa","bbb","ccc"}; 6 ddlDept.DataSource = list; 7 ddlDept.DataBind(); 8 ddlDept.SelectedIndex = 2; 9 } 10 }
不知道用jQuery怎么写。
另一种版本的写法(全部在前台完成):
1 <head runat="server"> 2 <title></title> 3 <script type="text/javascript" language="javascript"> 4 function SearchChange() { 5 var ddl = document.getElementById("DropDownList1") 6 var index = ddl.selectedIndex; 7 8 var Value = ddl.options[index].value; 9 var Text = ddl.options[index].text; 10 11 alert(Value); 12 alert(Text); 13 } 14 </script> 15 </head> 16 <body> 17 <form id="form1" runat="server"> 18 <div> 19 <asp:DropDownList ID="DropDownList1" runat="server" onchange="SearchChange();"> 20 <asp:ListItem Value="0">111</asp:ListItem> 21 <asp:ListItem Value="1">222</asp:ListItem> 22 <asp:ListItem Value="2">333</asp:ListItem> 23 </asp:DropDownList> 24 </div> 25 </form> 26 </body>