通过js获取DropDownList的选中项 

 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>
View Code

上面是前台代码,下面是后台代码.

 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>
View Code

 

 

 

 

 

 

 

 

 

 

posted on 2014-05-20 17:58  水语者9  阅读(359)  评论(0)  编辑  收藏  举报