ASP.NET jQuery 食谱7 (从DropDownList获取选择

      
        <
      
      
        form 
      
      
        id
      
      
        ="form1"
      
      
         runat
      
      
        ="server"
      
      
        >
      
      

      
        <
      
      
        div 
      
      
        align
      
      
        ="center"
      
      
        >
      
      

      
        <
      
      
        fieldset 
      
      
        style
      
      
        ="width: 400px; height: 80px;"
      
      
        >
      
      

      
        <
      
      
        p
      
      
        >
      
      

                      选择颜色：
      
        </
      
      
        p
      
      
        >
      
      

      
        <
      
      
        asp:DropDownList 
      
      
        ID
      
      
        ="ddlColor"
      
      
         runat
      
      
        ="server"
      
      
        >
      
      

      
        <
      
      
        asp:ListItem 
      
      
        Text
      
      
        ="--- 请选择 ---"
      
      
         Value
      
      
        =""
      
      
        ></
      
      
        asp:ListItem
      
      
        >
      
      

      
        <
      
      
        asp:ListItem 
      
      
        Text
      
      
        ="红色"
      
      
         Value
      
      
        ="1"
      
      
        ></
      
      
        asp:ListItem
      
      
        >
      
      

      
        <
      
      
        asp:ListItem 
      
      
        Text
      
      
        ="黄色"
      
      
         Value
      
      
        ="2"
      
      
        ></
      
      
        asp:ListItem
      
      
        >
      
      

      
        <
      
      
        asp:ListItem 
      
      
        Text
      
      
        ="蓝色"
      
      
         Value
      
      
        ="3"
      
      
        ></
      
      
        asp:ListItem
      
      
        >
      
      

      
        </
      
      
        asp:DropDownList
      
      
        >
      
      

      
        </
      
      
        fieldset
      
      
        >
      
      

      
        </
      
      
        div
      
      
        >
      
      

      
        <
      
      
        br 
      
      
        />
      
      

      
        <
      
      
        div 
      
      
        align
      
      
        ="center"
      
      
         id
      
      
        ="message"
      
      
        >
      
      

      
        </
      
      
        div
      
      
        >
      
      

      
        </
      
      
        form
      
      
        >
      
    

      
        <
      
      
        script 
      
      
        src
      
      
        ="Scripts/jquery-1.4.1-vsdoc.js"
      
      
         type
      
      
        ="text/javascript"
      
      
        ></
      
      
        script
      
      
        >
      
      

      
        <
      
      
        script 
      
      
        type
      
      
        ="text/javascript"
      
      
        >
      
      
        

                $(document).ready(
      
      
        function
      
      
         () {
        

      
      
        //
      
      
         绑定keyup和change事件
      
      
        

      
      
                    $(
      
      
        "
      
      
        #<%=ddlColor.ClientID %>
      
      
        "
      
      
        ).bind(
      
      
        "
      
      
        keyup change
      
      
        "
      
      
        , 
      
      
        function
      
      
         () {
        

      
      
        if
      
      
         ($(
      
      
        this
      
      
        ).val() 
      
      
        !=
      
      
        ""
      
      
        ) {
        

      
      
        //
      
      
         这里需要注意，$(this).text()获取的是整个集合的text属性内容，所以需要再过滤下，把选中的项取出来
      
      
        

      
      
                            $(
      
      
        "
      
      
        #message
      
      
        "
      
      
        ).text(
      
      
        "
      
      
        Text: 
      
      
        "
      
      
        +
      
      
         $(
      
      
        this
      
      
        ).find(
      
      
        "
      
      
        :selected
      
      
        "
      
      
        ).text() 
      
      
        +
      
      
        "
      
      
        Value: 
      
      
        "
      
      
        +
      
      
         $(
      
      
        this
      
      
        ).val());
        

                        }
        

      
      
        else
      
      
         {
        

                            $(
      
      
        "
      
      
        #message
      
      
        "
      
      
        ).text(
      
      
        ""
      
      
        );
        

                        }
        

                    });
        

                });
        

      
      
        </
      
      
        script
      
      
        >